DEV Community

Andriy Ovcharov
Andriy Ovcharov

Posted on

Why I Decided to Write My Own reset.css — Without Any Love for Normalize

#css #programming #webdev #beginners

“Minimalism isn’t about less. It’s about better.”
— something I muttered to myself while removing fieldset { display: block; } for the third time

When I first got into web development, one of the most annoying things was how different browsers rendered the same elements. Everyone recommended the same thing: Normalize.css or some variation of Reset.css.

But over time, I realized something:
They don’t solve my problems.
In fact, they often create new ones. Too cautious. Too outdated. Too opinionated in all the wrong ways.

So I wrote my own — called optimize.css — and I haven’t looked back.

Why even write your own reset?

Because most existing resets:

  1. Include legacy fixes for browsers no one uses anymore

  2. Come with styles I constantly have to override

  3. Miss modern needs: color-scheme, touch-action, system-ui fonts

  4. Aren’t designed for a component-based, utility-first mindset

What does my optimize.css do differently?

I didn’t just reset — I rethought what the baseline of a modern web project should be:

  1. Applies consistent box-sizing across the board

  2. Enhances text rendering and font smoothing for clarity

  3. Makes media elements (images, videos, SVGs) responsive by default

  4. Normalizes form controls for cross-browser consistency

  5. Adds dark mode support with @media (prefers-color-scheme: dark)

  6. Improves accessibility with proper :focus-visible outlines

  7. Handles little things: tap-highlight-color, input::-ms-clear, custom hr, and more

Here’s a glimpse of the root config:

:root {
  --main-bg-color: #fff;
  --main-text-color: #000;
  --focus-outline-color: #0056b3;
  --font-family-base: system-ui, -apple-system, Arial, Helvetica, sans-serif;
  box-sizing: border-box;
  font-size: 1rem;
}
Enter fullscreen mode Exit fullscreen mode

Who is this for?

  • Developers tired of fighting with over-opinionated resets
  • People who want a clean, modern baseline they control
  • Me — every time I start a new project and want a fresh, lightweight start.

Where to get it?

By following the link to the site optimizecss, you can download my file, as well as view its source code on my repository.

optimizecss

If you're also building your own setup from the ground up, I’d be happy to hear how you approach it. No sacred cows here. Let’s keep the reset clean — and meaningful.
I’d love your feedback ;)

Top comments (0)