CalmUI
Styling

Colors

Set text and background colors and reuse them across your project.

Edit the component's CSS to set text and background colors:

.panel {
  color: #ffffff;
  background-color: rgba(16, 29, 43, 0.9);
}

color sets the text color. background-color fills the panel. The last rgba() value controls transparency: 0 is clear and 1 is opaque.

For shared colors, create a named value in Themes and use it with var(--color-primary). See CSS variables.

For gradients, use Backgrounds and gradients. For shadows and color filters, use Effects. The CSS reference lists the supported limits in one place.