Back to posts

Minimalist Design Systems

Every design system I’ve built started complex and got simpler over time. The best ones begin with constraints.

The Temptation of Options

It’s easy to add:

  • 50 shades of gray
  • 12 font sizes
  • 8 button variants
  • 4 border radius options

More options feel like flexibility. They’re actually decision fatigue.

My Current Constraints

For this site, I set hard limits:

Colors

  • One background: #2d2d2d
  • One text: #ffffff
  • Two accents: muted and secondary
  • That’s it

Typography

  • One display font (Space Grotesk)
  • One body font (Inter)
  • One mono font (JetBrains Mono)
  • Three sizes: small, base, large

Spacing

  • 4px base unit
  • Multiples only: 4, 8, 16, 24, 32, 48, 64

Why Constraints Work

Speed: Fewer decisions means faster development.

Consistency: Everything looks related because it follows the same rules.

Maintainability: Less code to manage, fewer edge cases.

Focus: Constraints force you to solve real problems instead of styling trivia.

Adding Complexity

When you need something new, ask: can I build this from existing pieces? Most of the time, the answer is yes.

If not, add one thing. Not five. One.

The Result

This portfolio has fewer than 200 lines of custom CSS. It loads instantly, looks consistent, and I can modify anything in minutes.

Sometimes the best design system is barely a system at all.