Asif Youssuff

Is Firefox planning on adding support for conic-gradient?

Original Post

I can get a circular progress indicator very easily with it in Chrome. Is there another simple way in Firefox?

previewElement.style.backgroundImage = "conic-gradient(#BBB " + pieValue + "deg,#FFF 0)";

Gives me a circular progress bar. something like:

Video of an iOS device displaying three circular progress indicators

Is there an easy way to do this in firefox? Ive seen the “move rectangles around” solution but im looking for something simpler.

My Comments

Watch bug id 1175958.

People in the bug mention using SVG for what sounded like a similar use case.

This would work: https://codepen.io/xgad/post/svg-radial-progress-meters


If you liked this material, please consider supporting me. You can also message me on Mastodon.

This project is maintained by yoasif