Design System
Lab

Logo Lab

8 mark variants · lockup comparison · 3 sizes · dark + light context.

variants · dark
A · Current — concentric
baseline · 3 rings + solid node
B · All-stroke
no fill · cleaner at 14px
C · Dot center
circle node · feels like "socket"
D · Diamond
45° rotation · prism · stacked layers
E · Minimal
single frame + dot · quietest
F · Monogram C
frame + glyph · literal brand letter
G · Token grid
2×2 grid · reads as "design tokens"
H · Layered
stacked rects · cascade metaphor
sizes · 14 / 22 / 40
A
B
C
D
E
F
G
H
lockup · header context
A
coherentDesign Method
22px
B
coherentDesign Method
22px
C
coherentDesign Method
22px
D
coherentDesign Method
22px
E
coherentDesign Method
22px
F
coherentDesign Method
22px
G
coherentDesign Method
22px
H
coherentDesign Method
22px
variants · light
A · Current — concentric
B · All-stroke
C · Dot center
D · Diamond
E · Minimal
F · Monogram C
G · Token grid
H · Layered

to apply a variant · name it (e.g. «C») and I'll swap CoherentMark in components/site/Logo.tsx everywhere (header · DS · floating · favicon).