Post

👀 Coming to Chrome DevTools in Chrome 138: CSS Value Tracing When you hover a --custom-prop in a `var()`, DevTools currently shows you the computed value. From Chrome 138 onwards, you can hover the `var` part to see how CSS actually got to that value.

This also works on `calc()` and other mathematical functions like `min()`, which should help *a lot* when debugging these calculations.

Ah, this is very cool! I was thinking that some variant of this feature already exists, but perhaps it just shows you the definition of a referenced variable, not the intermediate evaluations.

Indeed: this thing shows you all intermediate evaluations.

0 reposts1 like