The hardest part of design isn’t adding things. It’s knowing what to leave out.
Whitespace is currency
Every element you place on a page spends attention. A good layout is one where you’ve spent that attention deliberately — on the heading that matters, the single call to action, the one number that proves your point.
When you find yourself reaching for a gradient, a shadow, or a third accent color, ask: what problem is this solving? Most of the time, the honest answer is “none.” It’s decoration. And decoration is the enemy of clarity.
A simple test
Remove the element. Does the design still communicate? If yes, leave it removed. If the meaning collapses, it earned its place.
function shouldKeep(element: Element): boolean {
return communicatesWithout(element) === false;
} Restraint isn’t a limitation. It’s the discipline that makes the rest of the work legible.
The core principles
Good design follows a few non-negotiable rules:
- Hierarchy first — If everything is loud, nothing is heard
- Whitespace earns its place — Empty space isn’t wasted space, it’s breathing room
- One accent, one voice — Multiple colors create multiple messages
- Typography does the heavy lifting — A well-set paragraph needs no decoration
The details are not the details. They make the design. — Charles Eames
Comparing approaches
Here’s how restraint plays out in practice:
| Approach | Elements | Clarity | Result |
|---|---|---|---|
| Maximalist | 15+ | Low | Confusion |
| Balanced | 8-12 | Medium | Acceptable |
| Restrained | 4-6 | High | Impactful |
The table doesn’t lie. Fewer elements consistently produce clearer communication.
A quick checklist
Before shipping any design, ask yourself:
- Does this element earn its place?
- Can I remove it without losing meaning?
- Is there only one visual voice?
- Does whitespace do the work?
If you answered “yes” to all four, you’ve designed with restraint.