CSS Creep

Click any element to inspect its CSS in a speech bubble, see its source and inheritance, and edit styles live.

Short description (≤132 chars — store limit): Click any element to inspect its CSS, trace where each rule comes from, and edit styles live — then hand the change to your AI. (122 chars) Detailed description (store listing body): CSS Creep turns any webpage into a live CSS playground. Flip it on from the toolbar, hover to highlight, and click an element to pop a slick speech bubble showing exactly how it's styled. Inspect • Hover-highlight tracks any element with its tag, id, class, and pixel size. • Click to pin a speech bubble pointing right at the element. • Direct and Inherited tabs separate the element's own rules from styles it inherits — each inherited group labeled with the ancestor it came from. • Every rule shows its source: the stylesheet filename, a <style> block, or element.style (hover for the full URL). Edit live • Change color, background, font, spacing, borders, shadows, display, and more — see it apply instantly. • Add any custom property/value on the fly. • Reset inline edits or copy the current CSS anytime. AI Ready • As you tweak, CSS Creep tracks every change (old → new). One click copies a clear, plain-language instruction — selector, source-file hint, and each edit — ready to paste into ChatGPT, Claude, or any AI so it applies the change to your real source code. Private by design • No accounts, no servers, no tracking, no network requests. Runs only on the tab you activate it on, and only when you click. Edits are temporary previews that vanish on reload. Perfect for developers, designers, and anyone learning CSS who wants to understand and experiment with styles without opening DevTools.