About

About StyleStats

StyleStats is a small open-source toolkit for measuring CSS. It parses an HTML page or a standalone stylesheet and produces a report — selector counts, unique colors, font sizes, !important usage, cohesion scores, and a handful of other indicators that tend to drift quietly as a codebase grows.

Why it exists

Most stylesheet quality issues don't show up as bugs. They show up as a slow erosion: the team adds another shade of grey, another !important override, another ID selector to fight specificity. Each individual change is reasonable. The pattern is the problem.

StyleStats turns those patterns into numbers. Numbers are easy to track over time, easy to put on a dashboard, and easy to argue about in code review. A growing count of unique font sizes is a cue to look at the type scale. An unusually low cohesion score tells you a selector is doing too much.

What it measures

• Stylesheets and inline <style> elements.
• Selectors broken down by type — ID, class, universal, attribute, pseudo, JavaScript hooks.
• Unique colors and unique font sizes across the document.
• !important keywords and float properties.
• Cohesion — how many declarations live behind the average selector, and which selector is the worst offender.

Origin

The original stylestats Node.js package was authored by t32k and was a popular CLI in the early-2010s era of front-end tooling. This site is a modern revival: the same metric philosophy, fresh content, and a curated library of sample reports for popular sites.

Get involved

Read the docs, follow the install guide, or browse sample results to get a feel for the output. Then run StyleStats against a project of your own and see what falls out.