Design Knowledge Base
Community-maintained principles reviewed before publication and retrieved as Agent design constraints.
Typographic Index Brand System
When a site uses large type, indexes, menus, and project lists as brand expression, typography must carry navigation, hierarchy, and information scent rather than acting only as a poster effect.
Expressive typography should turn brand voice into actionable structure: users should understand where they are, where to go next, and which items matter through type scale, placement, indexes, and states.93%Typography Color Accessibilitytypography / spacingText Spacing Resilience
Text Spacing Resilience turns a frequent interface judgment into an executable constraint before generation.
Interfaces should tolerate adjusted line height, letter spacing, font size, or browser zoom without hiding content.84%Typography Color Accessibilitytypography / font-pairingFont Pairing by Function
Font pairing should start from product function: brand voice, long reading, numeric comparison, and controls have different needs.
Typeface differences need a clear purpose; decorative mixing can increase reading cost.82%Typography Color Accessibilitytypography / font-weightFont Weight Emphasis
Font weight creates emphasis; it should not make every label bold.
Too much bold text loses emphasis and makes dense interfaces feel heavy.82%Typography Color Accessibilitytypography / readabilityLine Height and Measure
Long text needs comfortable line height and measure; dense interfaces still need readable text.
Overwide lines lose place, tight line height feels cramped, and loose line height reduces useful density.82%Typography Color Accessibilitytypography / hierarchyType Scale Hierarchy
Type scale should serve page structure and avoid hero-sized text in compact panels.
A clear type scale lets headings, labels, body text, and numbers each do their job.82%