Fibery
Home
--- version: "alpha" name: "Warm Modular Atlas" description: "A warm operations system built from cream paper fields, dark brown controls, and toy-like isometric proof scenes." colors: primary: " 2B221C" secondary: " FFF...
Open exampleLayout Principles
Browse DESIGN.md examples that explain layout principles through spacing logic, grid behavior, hierarchy, and section rhythm.
148 curated examples24 per pagePage 3 of 7
What To Look For
Study how these examples describe white space, grid logic, pacing, and layout hierarchy in a way implementation teams can actually reuse.
What To Compare
Focus on spacing rules, density control, rhythm between sections, alignment logic, and whether the layout principles feel operational instead of decorative.
Design Analysis
Common layout principles signals
--- version: "alpha" name: "Warm Modular Atlas" description: "A warm operations system built from cream paper fields, dark brown controls, and toy-like isometric proof scenes." colors: primary: " 2B221C" secondary: " FFF... --- version: "alpha" name: "Electric...
Recurring System Signals
- Primary ( 10183A): the single anchor color for major type and primary actions.
- Secondary ( FADC4B): butter-yellow utility chips and friendly support accents.
- Tertiary ( FF5E79): coral-pink emphasis block for one hero panel or loud punctuation.
- Display: rounded, friendly, and tightly tracked.
- Body: concise and direct, without startup-corporate stiffness.
- Labels: slightly stronger weight, but keep them in the same family to preserve warmth.
Related Keywords
OverviewImage DirectionColorsTypographyDisplay: rounded, friendly, and tightly trackedBody: concise and direct, without startup-corporate stiffnessKeep the page personable without losing commercial clarityKeep oatmeal as the dominant page fieldUse oatmeal and black as the structural baseLet whitespace do most of the talkingLayoutTertiary ( FA651E): Rare annotation or proof accent
2026-01-30
Reflection
Home
--- version: "alpha" name: "Electric Noir Salon" description: "A noir event microsite built from black stage space, luminous cobalt ticket pills, giant serif statements, and tiny all-caps metadata." colors: primary: " 31...
Open exampleDesign Gal Studio
Home
--- version: alpha name: Pastel Service Quilt description: Warm boutique service-marketing system with cream paper, navy typography, candy accent blocks, and rounded modular collage framing. colors: primary: " 10183A" se...
- Primary ( 10183A): the single anchor color for major type and primary actions.
- Secondary ( FADC4B): butter-yellow utility chips and friendly support accents.
Layout Principles FAQ
What should I study on this page?
Study how these examples describe white space, grid logic, pacing, and layout hierarchy in a way implementation teams can actually reuse.
Why browse this as a dedicated DESIGN.md collection?
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.