← Danio homeDocsGitHub
Brand mark
danio
a tiny fish. a tiny framework.

Danio is named for the zebra danio-js — one of the smallest, quickest fish there is. The mark keeps its two signatures: the lateral stripes, and a bright, curious eye. Azure body, cream stripes, an amber eye and a trail of bubbles.

01

The mark, everywhere it goes

Primary · on light
On dark
Reversed · on brand
danio-js
Horizontal lockup
danio-js
Stacked lockup
Monochrome
02

App icon & favicon

Squircle · reversed mark
Light tile · full colour
Dark tile · full colour
03

Palette

Azure#1466E0
Deep azure#0E4EAF
Amber#F4B740
Cream stripe#EAF2FF
Ink#10151C
04

Typefaces

Display · serif
A framework you can read.
UI · humanist sans
danio-js · install · deploy
Code · mono
npm create danio
05

A few rules

✓ Do

Give the fish room — keep clear space around it equal to the height of its eye. Let it swim to the right. Use the amber eye as the single warm accent.

✓ Do

Set the wordmark lowercase in the humanist sans, tight tracking. Pair it with the mark at the horizontal or stacked lockup shown above.

✕ Don't

Don't recolour the body outside azure, stretch the fish, add a second accent, or flip it to face left. Don't outline the mark.

✕ Don't

Don't place the full-colour mark on a busy photo — use the monochrome or reversed variant on anything that isn't a flat, calm ground.