traceless-style DevTools 作者: Spark Golden Tech
Inspect traceless-style atomic CSS classes, design tokens, dark mode, and RTL state on any page.
擴充套件後設資料
關於此擴充套件
A DevTools panel for traceless-style — the zero-runtime atomic CSS library for React, Next.js, Vite, Remix, Astro,
SvelteKit, Qwik, and Solid.
Inspect any traceless-style class on the live page in real time:
Pure read-only — the extension never executes user code, never makes network calls, never collects telemetry. All data
stays inside DevTools.
Works on any page using traceless-style v1.0.0 or later. Open DevTools (F12) on a page using the library, switch to
the traceless-style tab.
Source code: https://github.com/sparkgoldentech/traceless-style/tree/main/devtools
SvelteKit, Qwik, and Solid.
Inspect any traceless-style class on the live page in real time:
- Inspector — pick any element and see every
tl*class on it, the (property, value, selector) triplet each class
encodes, the cascade order showing which classes are currently contributing styles vs. overridden, and inline
conflict warnings when two classes set the same property. - Classes — searchable browser of every
tl*class on the page with use-counts. Filter byprop:valuesyntax. - Tokens — every
--tl-*CSS custom property surfaced from yourtl.defineTokenscalls, light and dark variants
side-by-side, live-editable. - Theme — toggle dark mode and RTL direction live, preview different
tlTheme*overrides without touching code. - Animations — list every
@keyframesregistered viatl.keyframes, with a one-click preview button per
animation. - Stats — rule count, used-class count, CSS bundle size, token / theme / animation counts.
Pure read-only — the extension never executes user code, never makes network calls, never collects telemetry. All data
stays inside DevTools.
Works on any page using traceless-style v1.0.0 or later. Open DevTools (F12) on a page using the library, switch to
the traceless-style tab.
Source code: https://github.com/sparkgoldentech/traceless-style/tree/main/devtools
由 1 位評論者給出 5 分
權限與資料
更多資訊