Paste or upload any CSS (or a full HTML/PHP file with <style> blocks or inline style attributes) and this tool tallies up every property it finds, then cross-references each one against a reference catalogue of CSS properties going back to the earliest browser days. Category, browser support, deprecated stragglers, vendor prefixes, everything, all laid out for you to see.
Upload a file or paste source code directly. Plain CSS works best, but this also reads <style> blocks and inline style="…" attributes out of full HTML, PHP, or similar markup files, and will pick up the real CSS properties inside SCSS or LESS source too. Bare declarations with no selector or braces at all (just lines like color: red; with nothing wrapping them) won't be picked up; wrap them in a selector or a style attribute first.
Paste text instead of uploading a file
Fetched Content
Overview
Property frequency
Every property found in your source, most to least common. Grey bars are properties this tool doesn't recognize from its reference catalogue — see the Unrecognized Properties section at the end.
✓ Copied
Category breakdown
The catalogue's classification field: what part of CSS a property belongs to, from layout systems like grid and flexbox to vendor-extension for old browser-prefixed properties.
By category
Category by decade
Each bar is a category present in your source; the colored segments show which decade each property in that category was introduced. A category built almost entirely from one color arrived in a single wave.
When these properties were introduced
Drawn only from recognized properties. Unrecognized ones have no catalogue date to plot. This catalogue leans on "uncertain" far more than the HTML tools' catalogues do, since a huge share of old browser-prefixed properties were never formally documented with a year. Those are called out separately below.
By decade
By introduction year
Age vs. usage
Each dot is one distinct property with a known year. Far left and high up means an old property you're using a lot; far right means something recently added. Hover a dot for the property name.
Browser support
A coarse, informational read on how safe each property is to rely on today, per the catalogue — not a validator-grade compatibility table.
By browser support
Spec & standards status
Where each property stands today: standard, experimental, deprecated, obsolete, or non-standard.
Standards status
Vendor prefixes & custom properties
A closer look at old browser-prefixed properties and modern --* custom properties found in your source.
Vendor prefixes in use
Custom properties (--*) in use
No vendor-prefixed or --* custom properties were found in this source.
Unrecognized properties
Properties found in your source that aren't in the reference catalogue. Typically preprocessor variables (like $primary from SCSS), typos, or something genuinely new. These are still counted above but can't be enriched with category or spec history.
