---
title: Background Color
position: 2
seo_title: Telerik and Kendo UI Background Color Utilities
seo_description: Use the Telerik and Kendo UI Background Color Utilities to
  control the color of an element's background.
---
## Background Color

The Telerik and Kendo UI Background Color Utilities are CSS classes that enable you to control the color of an element's background.

<CSSRulesList data='{"id":"background-color"}'></CSSRulesList>

### Applying a Background Color

Use the `k-bg-{color}` utilities to apply a background color. Replace `{color}` with the desired color variable, for example, `k-bg-primary`, `k-bg-secondary`, or `k-bg-warning`.

<LiveDemo data='{"links":[],"height":200,"demo":"utils/background/background-color/color","codePreviewSettings":{"filterSelector":".k-w-20"}}'></LiveDemo>