---
# System prepended metadata

title: Font Colors

---

> [name=Laureen Delhaye] **Validated** for me!

# Font Colors 
Font Colors & description

## Usage


## Style


## Code
Font colors are used to colorize all our branded texts, our lib have all classes ready to use and begin by `rs-txt-`. Texts are displaying different by their states, pay attention to use the right one for each case. (positive/negative)

### Define a simple Text Color: 
1. Select the color of your choice like `rs-txt-purple`
2. Add class to your HTML element.

> Ex: `rs-txt-purple` `rs-txt-black9` `rs-txt-promo` `rs-txt-blue`

#### All Text colors occurences
##### Branded Colors
```
rs-txt-black9
rs-txt-c2
rs-txt-tr2
rs-txt-purple
rs-txt-blue
rs-txt-dark-blue
rs-txt-purple6
rs-txt-promo
```

| 	Light theme | 	Dark theme |
| -------- | -------- |
| `rs-txt-error`     | `rs-txt-error-neg`    |
| `rs-txt-success`   | `rs-txt-success-neg`  |
| `rs-txt-warning`   | `rs-txt-warning-neg`  |

##### Competitors and social media colors
```
rs-txt-ce1
rs-txt-ce2
rs-txt-ce3
rs-txt-ce7

rs-txt-cfb
rs-txt-ctwit
rs-txt-cyou
rs-txt-clin
```

### Define a Selected Text: 
1. Select the only class `rs-txt-selected`
2. Add class to your HTML element.

`rs-txt-selected`

### Define a hover Text: 
1. Use the hover state `rs-txt-hover`. It exist some variations.
2. Add class to your HTML element.
#### All Hover Text occurences
```
rs-txt-hover-c2
rs-txt-hover
rs-txt-hover-inherit
```

### Define a Disables Text: 
1. Select `rs-txt-disabled` or `rs-txt-disabled-neg`
2. Add class to your HTML element.




| 	Light theme | 	Dark theme |
| -------- | -------- |
| `rs-txt-disabled`     | `rs-txt-disabled-neg`    |
