Typography Style Guide
A comprehensive guide to the text styles and typographic system used in the MetalHatsCats Neubrutalism design kit.
Headings
The Quick Brown Fox
Jumps Over The Lazy Dog
Pack My Box With Five Dozen Liquor Jugs
How Vexingly Quick Daft Zebras Jump
Body Text
Large body text for emphasis and intro paragraphs. Provides a solid presence without being a heading.
Standard body text for most content. Tuned for readability and neubrutalist character with a generous line height of 1.7.
Small body text for secondary information, meta data, and detailed notes where space is limited but clarity remains essential.
Prose Content
Rich Content Example
Typography in Neubrutalism is not just about reading; it's about stark structure. We use heavy borders, high contrast, and sharp drops to define the hierarchy.
- Bold interactive elements
- Heavy stroke accents
- Non-gradient fills
When writing articles, the .nb-prose class ensures that nested elements like lists, links, and code snippets adhere to the brand's aesthetic.
Heading Variants
Outline Style
.nb-h1--outlineBox Variant
.nb-h1--boxFlag Style Highlight
.nb-h1--flag