Design Reference v4
Two fonts. Fourteen colors. One crown. Everything decided, nothing wasted.
Typography
| Font | Role | Sample |
|---|---|---|
| Montserrat | Headings (h1โh4), labels, nav, badges, buttons, dates | The Queen's Decree |
| Lora | Body text, paragraphs, lists | The thing about web design is that it rarely feels personal. |
| Lora italic | Short blockquotes (large), long blockquotes (normal size) | You were not a fool. You merely believed yourself in love. |
The thing about web design is that it rarely feels personal. We reach for the same Tailwind defaults, the same Inter font, the same slate-gray cards. But what if your website felt like you? What if it had warmth, personality, and just a touch of drama?
You were not a fool. You merely believed yourself in love.
Lady Whistledown
The thing about web design is that it rarely feels personal. We reach for the same Tailwind defaults, the same Inter font, the same slate-gray cards. But what if your website felt like you? What if it had warmth, personality, and just a touch of drama?
That's what this redesign is about. Not following trends โ but building something that feels unmistakably yours.
Queen Raae
In Context
The full system working together in a realistic post layout.
The thing about web design is that it rarely feels personal. We reach for the same Tailwind defaults, the same Inter font, the same slate-gray cards. But what if your website felt like you?
Every great design starts with an even better story.
Lorinda Mamo
The foundation is warm cream โ not white, never white. On top of that:
๐ Key takeaway: Your color palette should feel like a wardrobe, not a spreadsheet.
Montserrat headings feel bold and readable. Lora body text stays warm and literary. The contrast between geometric sans-serif and organic serif creates that "playful meets royal" tension.
I wanted something that felt like me โ not another developer portfolio in dark mode. The plum is your backbone. The amber is your jewelry. The signature pop is your red lip. Everything else is just the cream that holds it all together.
Queen Raae
Fewer fonts means faster loads, simpler CSS, and a tighter visual identity. Montserrat handles everything structural โ headings, labels, navigation. Lora handles everything narrative โ body text, quotes, the words that matter.
My heart is, and always will be, yours.
Me, to well-structured HTML
That's the system. Clean enough to maintain, warm enough to feel personal.
Summary
Montserrat + Lora (two fonts only)
Montserrat: headings, labels, nav ยท Lora: body, italic for quotes
14 tokens
Short (centered, italic Lora 1.4rem) / Long (left-aligned, italic Lora 1rem)
Short: fleur above, punchy ยท Long: fleur beside, flowing
Fleur-de-lis bullets, โ ๐ โ dividers
Ornamental without being heavy
Double-line + Gilded
CSS-only, soft ornamental framing