Free tools
Free CSS tools. No signup, no tracking.
Four focused tools for inspecting, decoding, and building CSS — designed to solve one specific problem each, fast. Use them in the browser, then install the extension when you want the same power on any element, anywhere.
Tool directory
Free tool
Site Style Report
Paste a URL, get a full design-system breakdown.
Extract the color palette, typography scale, spacing values, border radii, and box shadows of any public website.
Open tool →Free tool
CSS Specificity Calculator
See which selector wins the cascade.
Paste one or more CSS selectors and see their specificity tuple, a plain-English ranking, and which rule the browser will apply.
Open tool →Free tool
Tailwind Class Decoder
Read dense utility classes at a glance.
Paste a Tailwind CSS class string and see what each utility does, the resolved CSS, and a live visual preview.
Open tool →Free tool
Box Shadow Lab
Build layered shadows visually, copy the CSS.
Design single- or multi-layer box shadows with sliders and a live preview. Export the CSS when it looks right.
Open tool →
Why CSSpeek built these
Every CSS-inspection workflow boils down to the same handful of questions: what color is this, what font is that, what's the specificity of this selector, how is that shadow actually built? These tools let you answer those questions on the open web, without installing anything. When you're ready to do the same thing live — hover any element on any page, copy any value — install CSSpeek.