This page documents the Monessen brand as rendered by the production design system. All typography, color tokens, and layout behavior shown here use the same Tailwind variants and CSS custom properties used across the live Monessen site.
Monessen uses a warm orange palette paired with softer tones.
Primary Brand
Used for emphasis and CTAs
--brand
Brand Tint (25%)
Used for soft backgrounds and supporting accents
--brand25
Primary Font
Mulish (sans-serif)
Used for body and UI
Heading Font
Questrial (sans-serif)
Used for headings
Heading Style
The quick brown fox jumps over the lazy dog
Body Style
The quick brown fox jumps over the lazy dog
Each text style reflects its responsiveness across breakpoints.
breakpoint → font size / line-height / tracking
Primary Button
Secondary Button
Outline Button
Mobile Button