Development & Design
Container Queries and the End of the Media Query Era
For two decades, responsive web design rested on a single technique: the media query. It was the tool that let websites adapt to different screen sizes, and it…
Open source · Node.js
Numbers that tell you when your CSS is getting away from you.
StyleStats parses any HTML or CSS document and produces a small set of metrics — selectors, colors, font sizes, cohesion, !important usage — that act as an early warning system for stylesheet complexity.
# install
$ npm install -g stylestats
# run
$ stylestats path/to/file.css
→ Total Stylesheets: 1
→ Selectors: 245
→ Unique Colors: 23
→ !important Keywords: 4
View test results for popular sites
Sample reports we keep on file — pick one to see the metrics.
#
Quantify complexity
Count selectors, unique colors, font sizes, and float properties — the signals that drift first.
∑
Track cohesion
Average and lowest cohesion scores reveal selectors that try to do too much at once.
⌥
Catch !important drift
Spot specificity wars before they become impossible to untangle.
From the blog
Articles on CSS, design systems, and front-end craft.
Development & Design
The Unused CSS Problem and Why Dead Styles Keep Piling Up
Every stylesheet accumulates ghosts. Rules written for a component that no longer exists, overrides for a layout that was redesigned two years ago, colours def…
Development & Design
The Design Tokens That Hold a Growing Stylesheet Together
Every stylesheet starts clean. The colours are consistent, the spacing is deliberate, the type scale makes sense. Then the project grows, contributors come and…
Development & Design
The Specificity Battles That Quietly Break Your Stylesheets
Almost every frustrating CSS bug — the style that refuses to apply, the colour that will not change, the layout that ignores your careful rule — traces back to…
Development & Design
Artificial Intelligence Is Transforming Online User Experiences Across Every Industry
Artificial intelligence has stopped being a feature companies announce and started being the substrate they build on. The shift happened faster than almost any…
Development & Design
The Casino Lobby, Deconstructed: A UX Teardown of Game Discovery
The home screen of an online casino is one of the hardest interface problems in consumer software, and almost nobody talks about it that way. A typical lobby h…