finds.dev← search

// the find

necolas/idiomatic-css

★ 6,656 · updated Dec 2022

Principles of writing consistent, idiomatic CSS.

A style guide document for writing consistent CSS, authored by Nicolas Gallagher (creator of normalize.css). It covers whitespace, commenting conventions, declaration formatting, and Sass-specific patterns. This is a reference doc, not a library — nothing to install.

The selector-per-line rule and one-declaration-per-line rule are genuinely useful for readable diffs in code review. The Sass section gives concrete nesting depth limits (1 level preferred, reassess at 2) rather than vague 'avoid deep nesting' advice. The practical example at the end shows the conventions working together in real CSS, which makes it easier to adopt than abstract rules alone. Translated into 17 languages, so it works as a shared reference across multilingual teams.

Last updated 2022 and predates widespread adoption of CSS nesting, custom properties as design tokens, and @layer — so it has nothing to say about patterns that now dominate modern CSS. The vendor-prefix examples (-webkit-box-sizing, -moz-box-sizing) are relics that will confuse anyone new to CSS. It's a document with opinions but no enforcement mechanism — you still need a linter config to actually hold a team to it, and it doesn't point you toward one. At 6k stars it carried real weight in 2014; in 2026 most teams just inherit a Prettier config and call it done.

View on GitHub →

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →