Color Ring

  render(<ColorRing
  visible={true}
  height="80"
  width="80"
  ariaLabel="color-ring-loading"
  wrapperStyle={{}}
  wrapperClass="color-ring-wrapper"
  colors={['#e15b64', '#f47e60', '#f8b26a', '#abbd81', '#849b87']}
  />)

---

Props

Name	Type	Default	Description
ariaLabel	string	color-ring-loading	Specifies the Aria label of the color-ring. This label will be applied to the aria-label attribute in the wrapper element.
colors	array	[ "#e15b64", "#f47e60", "#f8b26a", "#abbd81", "#849b87" ]	Array of colors to be used in the ring
height	number | string	80	Specifies the height of the color-ring SVG. For additional customization, employ the wrapper className.
visible	boolean	true	Controls the visibility of the color-ring. If set to false, the color-ring will not be rendered.
width	number | string	80	Specifies the width of the color-ring SVG. For further customization, utilize the wrapper className.
wrapperClass	string	undefined	Assigns a className to the wrapper for custom styling, overriding the default style.
wrapperStyle	object	{}	Applies styles to the wrapper. It should be a valid CSS object and can be used for custom styling, overriding the default style.

More example:

---