You don’t need all those classes—you can set CSS custom properties from HTML:
background-image: conic-gradient(var(--darkpurple) var(--angle), var(--lightpurple) 0);
<div style="--angle:50%">
You don’t need all those classes—you can set CSS custom properties from HTML:
background-image: conic-gradient(var(--darkpurple) var(--angle), var(--lightpurple) 0);
<div style="--angle:50%">
But this forces me to introduce style directly in my HTML.
I can see the value of the approach though. Thanks for commenting
Sadly attr()
for CSS doesn’t yet support type conversion in any browser (it’s in some spec). If it would be available one could drive styles not with inline styles, but also html attributes (e.g. the ones already on <progress>
).