---
description: >-
version: 11.17.0
generatedAt: 2026-11-05T09:55:46.934Z
checksum: 090b7d977ba4be5e2c4c04d199a30a4048416c59f443a56985df2f80629d9c40
---

# Color usage (deprecated)

<Intro>

---

**Deprecated:** The `--color-*` CSS custom properties and this color documentation are deprecated. Use [Design Tokens – Colors](/web/styling-and-themes/design-tokens/colors) instead.

---

Colors are defined in two types:

- Profile (Brand colors)
- UX (Custom web usage colors)

It is recommended to use **CSS Custom Properties name** like `--color-ocean-green` to use a color.

```css
.selector {
  background-color: var(--color-ocean-green);
}
```

See the [Color Table](/web/styling-and-themes/legacy-colors#legacy-color-palette).

---

<IntroFooter
  href="/web/get-started/guided-introduction/09-icons"
  text="Next - Icons"
/>

</Intro>