Render CSS Values in DEV Tools

Hi All :slight_smile:

because cwicly is build in mind for developers…is it possible to get the rendered CSS VAlues for i. E. an background gradient? because we msut fine adjust those values in the browser-view and not by try and error by code each time…we just see the variable classname but it would be good if we can switch this so that cwicly delivers the values here and is not using that variable…

thanx a lot

Hey @Timo.

Just click the variable and adjust it to your needs.
Hope that was helpful.


yo. no this it not possible (at leaset in firefox, havent testet other)…as long as it is an variable-classname / reference this is not possible.if you click into it it just became marked…

Bildschirmfoto 2024-01-18 um 11.57.32

Thanks for elaborating @Timo.

This is currently not possible in Firefox, but it’s in development.
If you need this functionality now, I recommend switching to a Chromium based browser, such as Chrome or Edge.

I left Firefox because of its shortcomings in the dev tools.

hmm in chrome in cant directly edit it…but a few lines above those variables are listed and there you can raelly do it, do you mean this way? but funny thing is now: i checked back into firefox…if you scroll all the way down to the so-called root elements there you can also see those variables now and tweak them…so it works. but you are overall right i think…a lot of years in my view firefox was better in dev-tools…now chrome is better it seems so yes.

firefox lets variable names tweak but you must search for them extra:

Hi @Timo - I recently purchased this extension for chrome:

This actually converts css variables to their computed values when you use the extension to inspect the code on a page. I’ve found it very useful