Brand Kit
QuietKeep Brand
Assets and guidelines for press, partners, and developers. Please follow the usage rules to represent QuietKeep correctly.
Questions? hello@quietkeep.com
Logo Variants
PWA & Platform Icons
Apple splash screen: link rel="apple-touch-startup-image" in layout.jsx. Manifest.json references 192 and 512 PNG.
Color Palette
Primary Indigo
#5b5ef4 · #6366f1
--primary
CTAs, links, active states
Deep Violet
#8b5cf6 · #818cf8
Gradient pair with Primary
Accent Green
#059669 · #10b981
--accent
Success, WhatsApp actions
Amber
#d97706 · #f59e0b
--amber
Warnings, reminders, premium
Alert Red
#dc2626 · #ef4444
--red
Errors, SOS, emergency
Surface Light
#ffffff · rgba(255,255,255,0.05)
--surface
Cards, modals
Background
#f4f6fb · #0d1117
--bg
Page background
Text Primary
#1e293b · #e2e8f0
--text
Body, headings
Text Muted
#64748b · #8892a4
--text-muted
Secondary labels
Typography
Display / H1
Keep Everything.
Heading / H2
Daily Brief
Body
Organised, quietly.
Caption
SECTION LABEL
Usage Guidelines
✅ Do
·Use on backgrounds with sufficient contrast
·Maintain aspect ratio — never stretch
·Leave clear space equal to icon height on all sides
·Use SVG for digital, PNG 512 for print
·Reference as "QuietKeep" (one word, camelcase)
❌ Do not
·Alter the gradient colors in the icon
·Add drop shadows or extra effects
·Place wordmark below 120 px width
·Combine with competing logo marks
·Use logo to imply endorsement without permission
OG / Share Image
Dynamic OG images are generated at /api/og with optional ?title=, ?sub=, and ?emoji= params.