01
Retro pixel wordmark: primary mark
ui/Logo/LogoRetro
Two color variants. Dark (white & yellow) for dark surfaces. Light (charcoal & yellow) for light surfaces and yellow brand tiles.
The yellow pixels stay on both. Never recolor: pick a variant, don't tint.
The yellow pixels stay on both. Never recolor: pick a variant, don't tint.
Optically pre-centred (2026-07). The wordmark's ink is top-heavy, only the
Flex-centre them as-is. Never add a translateY nudge. Ink height = 6/7 × box height: for 26px ink set
p descender fills the bottom, so all three files carry built-in top padding that puts the optical centre on the geometric centre.Flex-centre them as-is. Never add a translateY nudge. Ink height = 6/7 × box height: for 26px ink set
height: 30.33px. This was a breaking aspect change, retro went 376:96 to 376:112.
logo-retro-dark
on
--app-bg · --bg-secondary
logo-retro-light
on
white / light surfaces
02
Don't
Don't use the dark variant on light. The white pixels disappear.
Don't use the dark variant on yellow. Use the light variant, its charcoal pixels read clearly.
Don't use the light variant on dark. The charcoal pixels disappear; use the dark variant.
03
Kaomoji: brand voice glyphs
mono on web · text-only · never illustration
The first three ship; the rest are proposed. Web sets them in
Tone ladder: cheeky → instructive → quiet → error.
var(--font-mono); native and TV welcome screens set it in the sans face, since TV has no mono.Tone ladder: cheeky → instructive → quiet → error.
┌( ಠ‿ಠ)┘
welcome · sign-in, mobile and TV · shipped
ᕦ(ò_óˇ)ᕤ
www footer · shipped
┌( ಠ_ಠ)┘
www footer · shipped
ヽ(°〇°)ﾉ
empty files · proposed
( ⌐■_■)
transfers idle · proposed
¯\_(ツ)_/¯
no results · proposed
ᶻ 𝗓 𐰁
notifications · proposed
(x_x)
error · proposed