Knobs and faders and their styling / appearance

There was a similar question for V 0, i will give it a similar try.
It would be nice if we could do more "nicer" knobs (and faders). For Button a SVG could be "hacked in".

I find something like this really nice:

-> would something like a user canvas doable?


1 Like

There's no canvas widget in o-s-c, it would be nice but it's not likely to happen anytime soon. It may be possible however to build this kind of things using the html and css properties or with a svg widget.

ok, any minimal starting point would be nice (e.g. with html and css, so the knob would work as before). the knob itself is of type canvas, so my question about it

bump on this one(forgotten by myself) @jean-emmanuel could you give a starting point here with the html and css property? thanks

Here is an example with a fader, knobs are more complex to build with html (especially if you want them to be responsive).
htmlfader.json (2.5 KB)

Thanks for the starting point!

i got a little bit further, apart from the fact that i don't know how to add a variable for rotation(and how to calculate it -> -20 deg to 150 deg like the standard knob)...

transform: "rotate(" + var(--value) + "deg)";

(didn't work), i am not sure if the pointer events are correct here(so you can move it and it follows up correctly)

Don't understand how to do somekind of ring (or led ring) following the knob, like on the linked example
or here:

Thanks for any help..
htmlfader_and_knob.json (4.5 KB)