Published on Nov 25, 2025, filed under development, css, minimalism. (Share this post, e.g. on Mastodon or on Bluesky.)

Chris Coyier is inspiring, isn’t he 🙂 It’s not the first time Chris inspires me, that is, in this case with his article, The Coyier CSS Starter.

I’m not actually working with a “CSS starter” in my projects, and I wouldn’t call the following the “Meiert CSS starter,” but here are a few things I do (and don’t do) in my web projects.

Mind you: I have a thing for minimal web development.

What I Don’t Do

No Resets

I don’t use resets. I’ve written about CSS resets many times, but as you can imagine, in a nutshell, they aren’t necessary—and necessary they’d need to be for me to use them.

No :root Styling

It’s a detail, but I don’t use the :root selector in HTML, because the element in question is html. Accordingly, I question :root in HTML contexts.

Nothing Not Strictly Needed (Unless Desired)

Where possible, I rely on user agent defaults (and consider doing so an underestimated art form). When you check out the style sheets of Frontend Dogma and WebGlossary.info, for example, you’ll notice they don’t touch several core styles.

What I Do, in Most Projects

When I looked for commonalities across projects, I’ve found these ones.

scroll-behavior

I’ve found “smooth” scroll behavior to be preferable over “auto”:

html {
scroll-behavior: smooth;
}

text-wrap

As a smart way to improve typography, I’m a fan of text-wrap: pretty:

html {
text-wrap: pretty;
}

-webkit-font-smoothing

I’m not sure where I picked this up (though I should be), but to improve font styling on macOS, I have at some point added the following to my projects. It’s a placeholder likely for font-smooth:

html {
-webkit-font-smoothing: antialiased;
}

::selection (and ::target-text)

In many projects, I like to style selections, and I’ve been waiting for target text styling to likely style such text the same way, as in:

::selection,
::target-text {
background: #000;
color: #fff;
}

The values are examples that assume no duplication.

Minimal View Transitions

I like the effect and the perceived performance improvement of a minimal view transition:

@view-transition {
navigation: auto;
}

I do not currently provision anything here for reduced motion, but am monitoring if minimal view transitions cause issues.

Minimal Dark Mode

In many projects, I use a minimal dark mode, which I’ve explained in Minimal Dark Mode.

(I’m monitoring this, too, as it accepts some trade-offs.)

The Starter

Combined and sorted (declarations alphabetically, selectors by convention), this looks like this:

::selection,
::target-text {
background: #000;
color: #fff;
}

html {
-webkit-font-smoothing: antialiased;
scroll-behavior: smooth;
text-wrap: pretty;
}

@view-transition {
navigation: auto;
}

---

This is my CSS starter—a minimal CSS starter. Even though I use it in most projects, I wouldn’t call it a template, let alone suggest you and others should use it as such—but it probably allows for some cherry-picking, and also constructive discussion. Enjoy!

About Me

I’m Jens (long: Jens Oliver Meiert), and I’m a web developer, manager, and author. I’ve been working as a technical lead and engineering manager for companies you’ve never heard of and companies you use every day, I’m an occasional contributor to web standards (like HTML, CSS, WCAG), and I write and review books for O’Reilly and Frontend Dogma.

I love trying things, not only in web development and engineering management, but also in other areas like philosophy. Here on meiert.com I share some of my experiences and views. (I value you being critical, interpreting charitably, and giving feedback.)