Brand

The Borealis mark

Two brackets holding a ribbon of light. The brackets are the sandbox — a boundary you can see — and the ribbon is the work happening inside it. Everything on this page is free to use when you write about Borealis.

Borealis

The mark and the wordmark, on both grounds. In the lockup, the gap between them equals half the mark's width.

The four cuts

One mark, four files. Pick by the background you are placing it on, not by preference.

Primary

logo.svg

The default. Use it anywhere the background is dark — the product UI, dark decks, the terminal side of a README.

Light ground

logo-light.svg

The same mark in the deep colourway. Use it on white and on the light theme, where the bright cut has too little contrast.

Tile

logo-tile.svg

The mark on its own polar ground. Use it for favicons, app icons, avatars, and anywhere the background is unknown or busy.

Monochrome

logo-mono.svg

One colour, inherited from currentColor. Use it for engraving, embroidery, single-colour print, and anywhere the palette is not available.

Clear space and minimum size

Keep a margin of at least a quarter of the mark's height clear on all four sides. Nothing — type, rules, other logos, the edge of a card — comes inside it.

Minimum size

16px

20px

The tile cut holds down to 16px — it is what the favicon is built from. The flat mark needs 20px, because without a ground behind it the brackets start to close up. Below those sizes, use the tile.

Colour

The mark sits on the Borealis accent ramp: a teal that runs to cyan. There is no third hue.

Role	On dark	On light	Note
Left bracket	#38f5c8	#0f766e	Matches --accent-primary exactly
Right bracket	#1aa2c4	#1aa2c4	Deep cyan, the same value in both themes
Ribbon (top)	#f2fbff	#0b5752	The brightest point on dark, the darkest on light
Ribbon (mid)	#a3e8ff	#115e59
Ribbon (end)	#6bf8d7	#12928c
Tile ground	#081c2e	#081c2e	Always dark — the tile carries its own ground

Using it

Please do

Give it clear space of at least a quarter of its height on every side.
Use the tile cut whenever you cannot control the background.
Let it inherit the theme — in our own products it reads the --logo-* tokens.
Scale it proportionally, from the SVG, at any size at or above the minimums below.

Please don't

Do not recolour it. The two brackets and the ribbon are fixed relationships.
Do not stretch, skew, or rotate it.
Do not add effects — no shadows, glows, bevels, or outlines.
Do not place the bright cut on a light background, or the deep cut on a dark one.
Do not rebuild it from screenshots, or trace it. Use the SVG.
Do not crowd it, or lock it up with another logo without space between.

In our own products

Inside Borealis surfaces the mark is rendered inline, not as an <img>, so it can follow the theme. An externally referenced SVG cannot see the theme class on the document, which breaks the moment someone uses the theme switcher.

/* colours come from tokens that flip with the theme */
--logo-bracket-a   --logo-bracket-b
--logo-ribbon-from --logo-ribbon-mid --logo-ribbon-to

// then render the shared component, never an <img>
<Logo className="h-8 w-8" title="" />

This one is the live component. Switch the site between light and dark and it follows.

Anything else

For a use these rules don't cover — merchandise, an event backdrop, a co-branded lockup — write to [email protected] and we'll help. Borealis and the Borealis mark are trademarks of Amaretto Software Labs ltd. Please don't use them in a way that suggests we endorse or are affiliated with your product.