# Colors and fonts

## Font

Xena use default system fonts as to speed up loading. The UI will feel familiar to the end user. We only use the styles Regular and **Bold**.

## Colors

Please refer to our [UX guidelines](https://dev.xena.biz/xena-developer/the-possibilities/user-experience) on how to use colors.

{% hint style="info" %}
May 2020, our brand and theme colors was updated.
{% endhint %}

### System colors

| Use             | Color   |
| --------------- | ------- |
| Primary         | #007BFF |
| Success         | #28A745 |
| Info            | #17A2B8 |
| Warning         | #FFC107 |
| Danger          | #DC3545 |
| Borders         | #DEE2E6 |
| Font color      | #212529 |
| Body background | #F0F2F5 |

### Theme colors

| Theme name      | Color   |
| --------------- | ------- |
| Default (brand) | #9CCE6F |
| Green (1)       | #558D69 |
| Bluegreen (2)   | #76ADA2 |
| Blueish (3)     | #0092A0 |
| Purple (4)      | #780E57 |
| Pinkly (5)      | #A8687C |
| Red (6)         | #EB6B4A |
| Orange (7)      | #F4AB59 |
| Yellow (8)      | #FFF053 |
| Dark (9)        | #273743 |