Type scales for independent studios

Independent studios often inherit type systems built for SaaS dashboards: small body copy, loud buttons, and display type that shouts over the work. Midnight Office flips that ratio.

Body first

Set body text at eighteen pixels or more. Freelance sites are read, not skimmed. Muted captions can sit slightly smaller, but never below sixteen pixels on mobile.

Display with discipline

Headlines can be enormous — the CTA band proves it — but line-height stays above 1.05 so descenders survive. If a word needs color, give it space on both sides in the markup.

Tokens, not hex

Every colour in the theme resolves through CSS custom properties. Change --color-primary once and buttons, links, and focus rings follow. That is how you ship dark mode without maintaining two designs by hand.