EBRAINS Logo

The EBRAINS Design System logo is central to the EBRAINS brand identity, representing its commitment to advancing neuroscience research through cohesive and accessible digital solutions. The logo was updated as part of the 2025 EBRAINS Visual System and should be used with care to ensure consistent brand representation.

Logo Variants

The 2025 logo comes in two variants:

Positive — For use on light backgrounds. Features the EBRAINS gradient mark with dark text.
Negative — For use on dark backgrounds. Features the EBRAINS gradient mark with white text.

Positive

Negative

Using the Logo Component

The eds-logo component renders the correct logo variant automatically:

Properties

Property	Values	Default	Description
`type`	`positive`, `negative`	—	Logo variant for light or dark backgrounds
`href`	URL string	`/`	Link destination when the logo is clicked
`label`	string	`Home`	Accessible aria-label for the link

Clear Space

Always maintain sufficient space around the logo to ensure clarity and prevent visual clutter. The minimum clear space around the logo should be equal to the height of the “E” in “EBRAINS.”

What Not to Do

Accessing the Logo

There are several ways to access the EBRAINS logo depending on your project setup.

Via the `eds-logo` Component

The simplest way — use the web component directly. It handles variant switching and accessibility:

<!-- Install: npm install @ebrains/components -->
<eds-logo type="positive" href="/"></eds-logo>
<eds-logo type="negative" href="/"></eds-logo>

Available in React (EdsLogo), Angular, and Vue via their respective wrapper packages.

Via the `@ebrains/svgs` npm Package

Import the logo as an inline SVG string in any JavaScript project:

The package also exports euSvg, social media icons (twitter, linkedin, facebook, youtube, mastodon, bluesky), and GitLab logos (gitlabColor, gitlabBlack).

Via unpkg CDN (direct SVG files)

Access the raw SVG files directly from unpkg without installing anything:

positive.svg — for light backgrounds
negative.svg — for dark backgrounds

Or browse all logo files at unpkg.com/@ebrains/svgs.

Via GitLab Repository

The source SVG files are in the GitLab repository under packages/svgs/src/img/logo/:

2025 logos: packages/svgs/src/img/logo/2025/ — positive.svg and negative.svg
Legacy logos: packages/svgs/src/img/logo/horizontal/ and packages/svgs/src/img/logo/vertical/

File Formats

Format	Where	Use case
SVG (raw file)	unpkg CDN, GitLab, npm package	Web, print, any resolution
SVG (inline string)	`@ebrains/svgs` JS import	Dynamic rendering in apps
Web Component	`eds-logo` / `@ebrains/components`	Drop-in component with link + accessibility