Variants & color themes
2 logo variants, each rendered across 17 approved color themes. Every variant exports identically across every theme.
01 ⁄ horizontal
horizontal
Primary — on light backgroundprimary-on-background-light
Primary — on light surfaceprimary-on-surface-light
Primary — on whiteprimary-on-white
Primary — on dark backgroundprimary-on-background-dark
Primary — on dark surfaceprimary-on-surface-dark
Primary — on blackprimary-on-black
Full color — all primaryprimary-all
Full color — on light backgroundprimary-all-on-background-light
Full color — on dark backgroundprimary-all-on-background-dark
Full color — on blackprimary-all-on-black
Monochrome — black (K-only, all sizes)mono-black-k
Monochrome — rich black (print)mono-black-rich
Monochrome — white on darkmono-white-on-dark
Monochrome — white on blackmono-white-on-black
Black on primarymono-black-k-on-primary
Rich black on primary (print)mono-black-rich-on-primary
White on primary (decorative)mono-white-on-primary
02 ⁄ symbol
symbol
Primary — on light backgroundprimary-on-background-light
Primary — on light surfaceprimary-on-surface-light
Primary — on whiteprimary-on-white
Primary — on dark backgroundprimary-on-background-dark
Primary — on dark surfaceprimary-on-surface-dark
Primary — on blackprimary-on-black
Full color — all primaryprimary-all
Full color — on light backgroundprimary-all-on-background-light
Full color — on dark backgroundprimary-all-on-background-dark
Full color — on blackprimary-all-on-black
Monochrome — black (K-only, all sizes)mono-black-k
Monochrome — rich black (print)mono-black-rich
Monochrome — white on darkmono-white-on-dark
Monochrome — white on blackmono-white-on-black
Black on primarymono-black-k-on-primary
Rich black on primary (print)mono-black-rich-on-primary
White on primary (decorative)mono-white-on-primary
03 ⁄ Usage
Do & don’t
Do
Use the logo only in Signal Yellow (primary), Black (K-only), Rich Black, or White — never in secondary or status colors.Do
Pair yellow with black for high contrast; yellow with white has very low contrast (~1.8 ratio) — avoid for critical text or accessibility contexts.Do
Maintain clear space around the logo equal to 25% of its shortest side.Don’t
Don't place the yellow symbol on saturated backgrounds of similar hue (orange, gold, amber).Don’t
Don't substitute the muted UI yellow (`#E7C93F`, `primary-light-mode`) or the anchor yellow (`#E6B300`) inside logo artwork — those are UI tokens, not logo colors. The canonical Bilreda yellow is `#FADF06`.Don’t
Don't stretch, skew, rotate, or add effects (shadow, outline, glow).