Precision drawn by hand.
A design language where engineering documentation meets handmade warmth. One shared base (two typefaces, five core colors, one grid) is expressed in three registers: a cyanotype blueprint for adults and the brand, a paper collage for children's gameplay, and a graphite notebook for tutorials and lessons.
Registers
Every surface uses exactly one register. Pick it by who is looking.
Foundations
The shared base. It holds in every register.
§00Principles →Five rules that hold across every register. §01Typography →Two families, both single-purpose: the serif is human, Departure Mono is the machine. §02Color →Five locked core colors, plus one set per register. §03Grid and spacing →Visible graph paper, a 4/8 rhythm, strict alignment.
Registers in depth
§04 · ABlueprint →Adults, landing page, brand. A technical reference manual with a romantic voice. §05 · BCollage →Children 5–9, the actual games. Cut paper, watercolor washes, crayon. §06 · B2Blueprint Lab →Older children (8–9) and STEM. Register A drawings with child-friendly feedback. §07 · CGraphite →Tutorials and field notes. Pencil on graph paper, blue pencil for what matters.
Graphic elements and resources
LibraryIllustration →Every drawing in the design source, grouped by register and family. MaterialsPatterns and textures →One paper pattern per hue, plus shadow, grain, watercolor and crayon. §08Tokens and filters →Copy-ready CSS tokens and SVG filters, with live samples. §09Source and references →The Claude Design files, external references and how to change the language.
Where it lives in code
| Surface | Register | Code |
|---|---|---|
| ceooflittlepeople.com | A · Blueprint | fuisl/ceo-of-little-people, design-tokens/ |
| These docs | A · Blueprint | fuisl/coipe-docs, design-tokens/ |
| Teacher and admin screens | A · Blueprint | fuisl/coipe packages/ui |
| Games | B · Collage, B2 · Blueprint Lab | fuisl/coipe (to come) |
| Tutorials and lesson notes | C · Graphite | fuisl/coipe (to come) |
Tokens are canonical in fuisl/coipe at packages/design-tokens and copied verbatim into the other repositories. If these pages and the source page (Design Language.dc.html) ever disagree, the source wins and these pages are fixed.