Mono
Mono is disciplined brutalism. Every value sits on an 8px grid. Every block shares the same horizontal containment. Red accent on near-black — like a fire alarm in a dark corridor.
Discipline is clarity. The grid is the design.
8px Grid
Every spacing value is a multiple of 8px. No 0.4rem, no 1.25rem, no arbitrary numbers. 8, 16, 24, 32, 48, 64.
One Left Edge
All blocks share 24px horizontal padding. Draw a vertical line — hero, cards, tables, code, stats all align.
Zero Decoration
No radius. No shadows. No gradients. No glows. 1px borders when needed, nothing more. Helvetica at real weights.
| Block Type | Ink Left Edge | Mono Left Edge |
|---|---|---|
| Hero | 0px | 24px |
| Section Label | 0px | 24px |
| Cards | 20px (1.25rem) | 24px |
| Info Box | 16px (1rem) | 24px |
| Flow Chain | 24px (1.5rem) | 24px |
| Stat Group | 56px (3.5rem) | 24px |
| Page Nav | -16px (negative!) | 24px |
| Timeline | 0px | 24px |
| Property | Ink | Mono |
|---|---|---|
| Concept | Print monograph | Disciplined brutalism |
| Accent | Gold | Red / Vermillion |
| Radius | 0px | 0px |
| Shadows | None | None |
| Font Weights | 200–400 (fragile) | 400–700 (substantial) |
| Spacing System | Arbitrary values | Strict 8px grid |
| Left Edge Count | 6+ different positions | ONE position (24px) |
| Line Height | 1.75 (overly airy) | 1.5 (disciplined) |
yaml
# Mono theme in a Gutenberg projectproject: my-docstheme: mono# Every block aligns to the same 24px grid.# No per-page theme overrides needed.css
/* The mono spacing scale — 8px multiples only */
--mono-xs: 8px; /* 0.5rem — tight gaps */
--mono-sm: 16px; /* 1rem — card gaps */
--mono-md: 24px; /* 1.5rem — containment */
--mono-lg: 32px; /* 2rem — block gaps */
--mono-xl: 48px; /* 3rem — sections */
--mono-2xl: 64px; /* 4rem — major breaks */
- 5
- Themes Available
- 8px
- Grid Unit
- 1
- Left Edge
Analysis
Diagnosed Ink
Design
Designed Mono
Build
Built CSS
Deploy
Published Demo
Mono — the grid is the design. Built with Gutenberg.