ColorDecoration Beta React-only

ColorDecoration serves for displaying a decorative strip of colour in a Card.

Loading demo…

Rules For Developers

ColorDecoration has a variety of uses, and something card-like usually acts as a wrapper, i.e. the element the decoration is attached to.
However, any wrapper is possible. Given that ColorDecoration is an absolutely positioned element, there has to be a wrapper that provides position other than static.
Said wrapper is also responsible for hiding the overflow whenever rounded corners are needed.
The color can be specified using the color or colorValue prop, i.e. a dedicated color or an arbitrary value. Additionally, a .g-bg-<color> background color as className works as well.