Browse DESIGN.md examples that emphasize typography systems, type scale, font pairing, and hierarchy as reusable implementation guidance.
What To Study
Compare how these systems define display type, body fonts, scale jumps, density, and readability rules instead of leaving typography as vague visual taste.
What To Compare
Focus on font roles, scale naming, line-height intent, responsive hierarchy, and whether the system makes typography easy for engineers and AI tools to apply consistently.
Design Analysis
--- version: alpha name: Grainy Conversion Studio description: Dark portfolio-marketing system with grainy charcoal fields, coral action accents, monochrome proof imagery, and sharp rectangular CTA geometry. colors: prim... --- version: alpha name: Tactile Con...
Hey
Home
--- version: alpha name: Grainy Conversion Studio description: Dark portfolio-marketing system with grainy charcoal fields, coral action accents, monochrome proof imagery, and sharp rectangular CTA geometry. colors: prim...
App Flow
Home
--- version: alpha name: Tactile Control Console description: Sparse industrial-soft studio system with pale gray negative space, oversized tactile dial imagery, chartreuse control accents, and dark pill actions. colors:...
Framer
Home
--- version: alpha name: Midnight Builder Marquee description: Black-stage marketing system with oversized white type, cool gray support copy, medium-radius rounded-rectangle CTAs, and polished preview-led proof. colors:...
Compare how these systems define display type, body fonts, scale jumps, density, and readability rules instead of leaving typography as vague visual taste.
A focused collection makes it easier to compare how teams describe one system concern consistently across many examples instead of mixing unrelated signals on a single page.
