Cascade Trace szerző: nguyenhann3492

Follow a style to its source.

Cascade Trace is a focused CSS inspection workbench for the webpage you are viewing. Select an element, choose a property, and see the value the browser currently computes alongside the readable author declarations that help explain it.

The interface separates measured appearance from source attribution. The computed value comes from the browser. Declaration ordering is shown for supported, readable author CSS; when layers, complex selectors, inaccessible stylesheets or other unsupported cascade features prevent reliable ordering, the tool labels the result as partial instead of pretending to know the winner.

What you can do:
- Pick a page element directly, or move up to its parent.
- Inspect common properties including colour, typography, dimensions, display, positioning, spacing, overflow and white-space.
- View rendered border-box dimensions, box-sizing, padding and margins.
- Examine matching declarations, their selector, source label and !important status.
- See inherited declarations and follow var() references from the top readable candidate, with bounded depth and cycle handling.
- Preview a valid value for an allowed CSS property using a temporary inline !important override.
- Undo preview edits, export a CSS patch, or download a JSON inspection snapshot.
- Move or collapse the workbench to reach the page behind it.

Start on an ordinary website. Open Cascade Trace from the toolbar, press Open CSS inspector, and choose Inspect an element. Escape cancels selection. Use Refresh after the page changes. The view is an explicit snapshot, not a continuously updating replacement for browser DevTools.

Preview supports colour, background colour, font size, line height, width, max-width, margin, padding, gap, border radius and white-space. CSS values are checked by the browser. URLs, declaration separators and unsupported properties are rejected. Closing the tool restores its edits. If the website changed the same property during a preview, undo preserves the website's newer value and reports the conflict when invoked from the undo action.

Everything is local to the current document. No account, analytics, history database or remote service is used.