Conic gradients

The conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.

Baseline Status: Achieved Widely Available on May 17, 2023 (Cross-browser Newly Available since Nov 17, 2020).

Desktop Browser Engine Support

Google Chrome

69

Supported

Mozilla Firefox

83

Supported

Apple Safari

12.1

Supported

Microsoft Edge

79

Supported

Mobile Browser Engine Support

Chrome Android

69

Firefox Android

83

Safari iOS

12.2

Specifications and References

Specification ↗ Can I Use (css-conic-gradients) ↗ Feature XML ↗

MDN Browser Compat Data Keys:

css.types.gradient.conic-gradient ↗ css.types.gradient.conic-gradient.doubleposition ↗ css.types.gradient.conic-gradient.single_color_stop ↗ css.types.gradient.repeating-conic-gradient ↗ css.types.gradient.repeating-conic-gradient.single_color_stop ↗