Monarch Design System

Monarch Typography System

Corporate fonts (PF DIN) ensure brand consistency across all public-facing materials. Office fonts (Bespoke, Space Mono) are for internal and collaborative documents when PF DIN embedding isn't possible.

Corporate Typeface

Download PF DIN Fonts
MONARCH

PF DIN Stencil Pro

Large titles, hero text, presentations, posters, web headers (18pt+) View on Parachute
PF DIN Display Pro

PF DIN Display Pro

Section headings, subheadings, reports, web content, documents (12-24pt) View on Parachute
The development and provision of digital technology is transforming society in multiple ways.

PF DIN Serif

Body text, paragraphs, long-form content, articles, reports, documentation (9-14pt) View on Parachute
CAPTIONS AND LABELS

PF DIN Mono Pro

Captions, code, data tables, calculations, interface text, metadata (6-9pt) View on Parachute

Office Fonts

Only for collaborative documents when PF DIN cannot be embedded
Download Office Fonts
BESPOKE STENCIL

Bespoke Stencil

Office document titles, presentations, PowerPoint headers, Word titles (18pt+) View on Fontshare
Bespoke Sans

Bespoke Sans

Office headings, section titles, Excel headers, Word headings (12-18pt) View on Fontshare
Digital technology is transforming society in multiple ways.

Bespoke Serif

Office document body text, Word paragraphs, report content (9-14pt) View on Fontshare
TECHNICAL ELEMENTS

Space Mono

Captions, code, data tables, calculations, Excel formulas, code blocks (6-9pt) View on Google Fonts

Monarch Icon System

Install the RemixIcon font, then search for icons below and click to copy the formatted icon directly. The copied icon is ready to paste into any text field or document.
GitHub Repository Remix Icon Website Download TTF Font

Pattern Generation

Use patterns to create visual rhythm and texture in backgrounds, dividers, or decorative elements. Ideal for adding subtle depth without overwhelming content. Perfect for dynamic expressions and large area applications.

Tessellation & Tiling

Use tessellations for creating seamless repeating patterns in large-scale applications like wallpapers, packaging, or architectural elements. Perfect for brand consistency across surfaces. Ideal for more static expressions and versatile usage from small details to large installations.

Mosaic Generation

Use mosaics to create sophisticated abstractions that serve dual purposes: protecting sensitive information while crafting beautiful cover illustrations and topical metonymic imagery. Perfect for anonymizing project content, creating visual metaphors for complex topics, designing report covers, and abstracting classified material with distinctive appeal that reinforces Monarch's brand identity.

Monarch Colour System

Use colors strategically to convey meaning, establish hierarchy, and guide user attention. Each hue serves specific communication purposes in professional contexts.

Brand Colours

Guardian Midnight
Primary brand identity, corporate security solutions, and Business department
--guardian-700 oklch(0.23 0.0855 262.75) #261269 cmyk(79% 89% 0% 59%)
Sentinel Strong
Cyber security operations, threat monitoring, and Operations department
--sentinel-400 oklch(0.56 0.0708 242) #6075ca cmyk(53% 41% 0% 21%)
Shield Strong
Physical security, infrastructure protection, and Admin department
--shield-400 oklch(0.71 0.0447 215.19) #8ec8c6 cmyk(30% 0% 2% 22%)

Secondary Colours

Alert Strong
Critical threats, security breaches, and emergency alerts
--alert-400 oklch(0.65 0.1826 24.35) #ff6a53 cmyk(0% 58% 67% 0%)
Caution Strong
Risk assessments, security warnings, and attention-critical elements
--caution-400 oklch(0.70 0.16 60) #f28c1e cmyk(0% 43% 88% 5%)
Safety Strong
Secure confirmations, successful operations, and safety protocols
--safety-400 oklch(0.65 0.12 150) #51b76a cmyk(56% 0% 43% 28%)
Authority Strong
Government relations, executive communications, and high-clearance content
--authority-400 oklch(0.65 0.13 300) #b068bb cmyk(8% 44% 0% 27%)

Tonal Spectrum

Guardian Blue

Guardian Light --guardian-100 oklch(0.85 0.02 262.75) #d8d2f0 cmyk(11% 13% 0% 6%)
Guardian Soft --guardian-200 oklch(0.75 0.03 262.75) #b7aede cmyk(18% 21% 0% 13%)
Guardian Medium --guardian-300 oklch(0.65 0.045 262.75) #9586cc cmyk(28% 33% 0% 20%)
Guardian Strong --guardian-400 oklch(0.55 0.055 262.75) #7561b5 cmyk(37% 46% 0% 29%)
Guardian Deep --guardian-500 oklch(0.45 0.07 262.75) #5840a0 cmyk(45% 60% 0% 37%)
Guardian Dark --guardian-600 oklch(0.35 0.08 262.75) #3d2486 cmyk(55% 73% 0% 48%)
Guardian Midnight --guardian-700 oklch(0.23 0.0855 262.75) #261269 cmyk(79% 89% 0% 59%)

Sentinel Blue

Sentinel Light --sentinel-100 oklch(0.85 0.025 242) #d3d8f4 cmyk(14% 11% 0% 4%)
Sentinel Soft --sentinel-200 oklch(0.75 0.04 242) #acb6e7 cmyk(25% 20% 0% 9%)
Sentinel Medium --sentinel-300 oklch(0.65 0.055 242) #8595d9 cmyk(39% 30% 0% 15%)
Sentinel Strong --sentinel-400 oklch(0.56 0.0708 242) #6075ca cmyk(53% 41% 0% 21%)
Sentinel Deep --sentinel-500 oklch(0.45 0.06 242) #455aac cmyk(60% 48% 0% 33%)
Sentinel Dark --sentinel-600 oklch(0.35 0.055 242) #2d428d cmyk(68% 53% 0% 45%)
Sentinel Midnight --sentinel-700 oklch(0.23 0.05 242) #1a2a6c cmyk(76% 61% 0% 58%)

Shield Turquoise

Shield Light --shield-100 oklch(0.90 0.02 215.19) #dbe9ec cmyk(6% 0% 0% 8%)
Shield Soft --shield-200 oklch(0.85 0.03 215.19) #c4dedf cmyk(12% 0% 0% 13%)
Shield Medium --shield-300 oklch(0.80 0.04 215.19) #add3d2 cmyk(19% 0% 0% 17%)
Shield Strong --shield-400 oklch(0.71 0.0447 215.19) #8ec8c6 cmyk(30% 0% 2% 22%)
Shield Deep --shield-500 oklch(0.60 0.045 215.19) #71aca9 cmyk(35% 0% 3% 33%)
Shield Dark --shield-600 oklch(0.50 0.04 215.19) #56908d cmyk(41% 0% 4% 43%)
Shield Midnight --shield-700 oklch(0.23 0.04 215.19) #1e3f3f cmyk(53% 0% 0% 75%)

Neutral

Neutral Light --neutral-100 oklch(0.85 0 0) #d6d6d6 cmyk(0% 0% 0% 16%)
Neutral Soft --neutral-200 oklch(0.75 0 0) #b8b8b8 cmyk(0% 0% 0% 28%)
Neutral Medium --neutral-300 oklch(0.65 0 0) #9a9a9a cmyk(0% 0% 0% 40%)
Neutral Strong --neutral-400 oklch(0.55 0 0) #7e7e7e cmyk(0% 0% 0% 51%)
Neutral Deep --neutral-500 oklch(0.45 0 0) #636363 cmyk(0% 0% 0% 61%)
Neutral Dark --neutral-600 oklch(0.35 0 0) #4a4a4a cmyk(0% 0% 0% 71%)
Neutral Midnight --neutral-700 oklch(0.23 0 0) #303030 cmyk(0% 0% 0% 81%)

Base

White --white oklch(1.0 0 0) #ffffff cmyk(0% 0% 0% 0%)
Black --black oklch(0 0 0) #000000 cmyk(0% 0% 0% 100%)

Alert Red

Alert Light --alert-100 oklch(0.90 0.07 24.35) #ffd7cc cmyk(0% 16% 20% 0%)
Alert Soft --alert-200 oklch(0.85 0.10 24.35) #ffbba8 cmyk(0% 27% 34% 0%)
Alert Medium --alert-300 oklch(0.75 0.15 24.35) #ff907a cmyk(0% 43% 52% 0%)
Alert Strong --alert-400 oklch(0.65 0.1826 24.35) #ff6a53 cmyk(0% 58% 67% 0%)
Alert Deep --alert-500 oklch(0.55 0.17 24.35) #e24938 cmyk(0% 68% 75% 11%)
Alert Dark --alert-600 oklch(0.45 0.15 24.35) #bb362c cmyk(0% 71% 76% 27%)
Alert Midnight --alert-700 oklch(0.23 0.14 24.35) #651b1a cmyk(0% 73% 74% 60%)

Caution Orange

Caution Light --caution-100 oklch(0.90 0.08 60) #ffdcb5 cmyk(0% 14% 29% 0%)
Caution Soft --caution-200 oklch(0.85 0.12 60) #ffc184 cmyk(0% 24% 48% 0%)
Caution Medium --caution-300 oklch(0.75 0.14 60) #ffa54a cmyk(0% 35% 71% 0%)
Caution Strong --caution-400 oklch(0.70 0.16 60) #f28c1e cmyk(0% 43% 88% 5%)
Caution Deep --caution-500 oklch(0.55 0.17 60) #c86c12 cmyk(0% 47% 91% 22%)
Caution Dark --caution-600 oklch(0.45 0.15 60) #a1520f cmyk(0% 49% 91% 37%)
Caution Midnight --caution-700 oklch(0.23 0.10 65) #552b12 cmyk(0% 50% 79% 67%)

Safety Green

Safety Light --safety-100 oklch(0.90 0.07 150) #c6f9d5 cmyk(19% 0% 14% 2%)
Safety Soft --safety-200 oklch(0.85 0.09 150) #9bedb2 cmyk(34% 0% 24% 7%)
Safety Medium --safety-300 oklch(0.75 0.10 150) #77d28d cmyk(42% 0% 32% 18%)
Safety Strong --safety-400 oklch(0.65 0.12 150) #51b76a cmyk(56% 0% 43% 28%)
Safety Deep --safety-500 oklch(0.55 0.13 150) #359b51 cmyk(65% 0% 48% 39%)
Safety Dark --safety-600 oklch(0.45 0.11 150) #25803d cmyk(72% 0% 52% 50%)
Safety Midnight --safety-700 oklch(0.23 0.10 150) #0e4121 cmyk(79% 0% 49% 74%)

Authority Purple

Authority Light --authority-100 oklch(0.90 0.05 300) #f3d2f6 cmyk(2% 14% 0% 4%)
Authority Soft --authority-200 oklch(0.85 0.08 300) #e4b5e9 cmyk(3% 23% 0% 9%)
Authority Medium --authority-300 oklch(0.75 0.11 300) #ca8fd2 cmyk(5% 32% 0% 18%)
Authority Strong --authority-400 oklch(0.65 0.13 300) #b068bb cmyk(8% 44% 0% 27%)
Authority Deep --authority-500 oklch(0.55 0.15 300) #9244a4 cmyk(12% 58% 0% 36%)
Authority Dark --authority-600 oklch(0.35 0.12 300) #5d2872 cmyk(19% 65% 0% 55%)
Authority Midnight --authority-700 oklch(0.23 0.10 300) #3c1a4b cmyk(21% 65% 0% 71%)