# Colors

<!-- prettier-ignore-start -->
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
## Table of Contents

- [Tokens](#tokens)
- [Color variables](#color-variables)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->
<!-- prettier-ignore-end -->

## Tokens

Legend:

- ✨ New
- ☠️ Deprecated (to be removed next version)

| v9                     | v10                            |
| ---------------------- | ------------------------------ |
| `brand-01`             | replaced with `interactive-01` |
| `brand-02`             | replaced with `interactive-02` |
| `brand-03`             | replaced with `interactive-03` |
|                        | ✨ `interactive-04`            |
| `ui-01`                | No change                      |
| `ui-02`                | No change                      |
| `ui-03`                | No change                      |
| `ui-04`                | No change                      |
| `ui-05`                | No change                      |
|                        | ✨ `ui-background`             |
| `text-01`              | No change                      |
| `text-02`              | No change                      |
| `text-03`              | No change                      |
|                        | ✨ `text-04`                   |
|                        | ✨ `link-01`                   |
| `inverse-01`           | No change                      |
| `inverse-02`           | No change                      |
| `field-01`             | No change                      |
| `field-02`             | No change                      |
| `support-01`           | No change                      |
| `support-02`           | No change                      |
| `support-03`           | No change                      |
| `support-04`           | No change                      |
| `nav-01`               | ☠️ Deprecated                  |
| `nav-02`               | ☠️ Deprecated                  |
| `nav-03`               | ☠️ Deprecated                  |
| `nav-04`               | ☠️ Deprecated                  |
| `nav-05`               | ☠️ Deprecated                  |
| `nav-06`               | ☠️ Deprecated                  |
| `nav-07`               | ☠️ Deprecated                  |
| `nav-08`               | ☠️ Deprecated                  |
|                        | ✨ `focus`                     |
| `hover-primary`        | No change                      |
|                        | ✨ `active-primary`            |
| `hover-`primary`-text` | No change                      |
| `hover-secondary`      | No change                      |
|                        | ✨ `active-secondary`          |
|                        | ✨ `hover-tertiary`            |
|                        | ✨ `active-tertiary`           |
| `hover-field`          | ☠️ Deprecated, use `hover-ui`  |
|                        | ✨ `hover-ui`                  |
| `active-01`            | ☠️ Deprecated, use `active-ui` |
|                        | ✨ `active-ui`                 |
|                        | ✨ `selected-ui`               |
|                        | ✨ `hover-selected-ui`         |
| `hover-danger`         | No change                      |
|                        | ✨ `active-danger`             |
| `hover-row`            | No change                      |
|                        | ✨ `visited-link`              |
|                        | ✨ `disabled-01`               |
|                        | ✨ `disabled-02`               |
|                        | ✨ `disabled-03`               |

## Color variables

| v9                   | v10                   |
| -------------------- | --------------------- |
| `color__blue-*`      | `ibm-color__blue-*`   |
| `color__navy-gray-*` | ☠️ Deprecated         |
| `color__white`       | `ibm-color__white`    |
| `color__blue-5`      | ☠️ Deprecated         |
| `color__gray-1`      | ☠️ Deprecated         |
| `color__gray-2`      | ☠️ Deprecated         |
| `color__gray-3`      | ☠️ Deprecated         |
| `color__teal-*`      | ☠️ Deprecated         |
| `color__green-*`     | `ibm-color__green-*`  |
| `color__yellow-*`    | `ibm-color__yellow`   |
| `color__orange-*`    | `ibm-color__orange`   |
| `color__red-*`       | `ibm-color__red-*`    |
| `color__purple-*`    | `ibm-color__purple-*` |
