# Colors

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

## How To Use

```javascript
import {Colors} from '@lamvd0101/tiki-ui/theme';

// Get a blue_10 color
console.log(Colors.blue_10());
// --> Result: #F0F8FF

// Get a blue_10 color with opacity property is 50%
console.log(Colors.blue_10(50));
// --> Result: rgba(240, 248, 255, 0.5)
```

## Color Tokens

| Token Name | Value   | Preview                                                             |
| ---------- | ------- | ------------------------------------------------------------------- |
| blue_10    | #F0F8FF | ![#F0F8FF](https://via.placeholder.com/100x15/F0F8FF/000000?text=+) |
| blue_20    | #DBEEFF | ![#DBEEFF](https://via.placeholder.com/100x15/DBEEFF/000000?text=+) |
| blue_30    | #C2E1FF | ![#C2E1FF](https://via.placeholder.com/100x15/C2E1FF/000000?text=+) |
| blue_40    | #94CDFF | ![#94CDFF](https://via.placeholder.com/100x15/94CDFF/000000?text=+) |
| blue_50    | #5CB3FF | ![#5CB3FF](https://via.placeholder.com/100x15/5CB3FF/000000?text=+) |
| blue_60    | #1A94FF | ![#1A94FF](https://via.placeholder.com/100x15/1A94FF/000000?text=+) |
| blue_70    | #0B74E5 | ![#0B74E5](https://via.placeholder.com/100x15/0B74E5/000000?text=+) |
| blue_80    | #0D5BB5 | ![#0D5BB5](https://via.placeholder.com/100x15/0D5BB5/000000?text=+) |
| blue_90    | #074183 | ![#074183](https://via.placeholder.com/100x15/074183/000000?text=+) |
| blue_100   | #052E5C | ![#052E5C](https://via.placeholder.com/100x15/052E5C/000000?text=+) |
| white      | #FFFFFF | ![#FFFFFF](https://via.placeholder.com/100x15/FFFFFF/000000?text=+) |
| gray_10    | #F5F5FA | ![#F5F5FA](https://via.placeholder.com/100x15/F5F5FA/000000?text=+) |
| gray_20    | #EBEBF0 | ![#EBEBF0](https://via.placeholder.com/100x15/EBEBF0/000000?text=+) |
| gray_30    | #DDDDE3 | ![#DDDDE3](https://via.placeholder.com/100x15/DDDDE3/000000?text=+) |
| gray_40    | #C4C4CF | ![#C4C4CF](https://via.placeholder.com/100x15/C4C4CF/000000?text=+) |
| gray_50    | #A6A6B0 | ![#A6A6B0](https://via.placeholder.com/100x15/A6A6B0/000000?text=+) |
| gray_60    | #808089 | ![#808089](https://via.placeholder.com/100x15/808089/000000?text=+) |
| gray_70    | #64646D | ![#64646D](https://via.placeholder.com/100x15/64646D/000000?text=+) |
| gray_80    | #515158 | ![#515158](https://via.placeholder.com/100x15/515158/000000?text=+) |
| gray_90    | #38383D | ![#38383D](https://via.placeholder.com/100x15/38383D/000000?text=+) |
| gray_100   | #27272A | ![#27272A](https://via.placeholder.com/100x15/27272A/000000?text=+) |
| green_10   | #EFFFF4 | ![#EFFFF4](https://via.placeholder.com/100x15/EFFFF4/000000?text=+) |
| green_20   | #D7FAE0 | ![#D7FAE0](https://via.placeholder.com/100x15/D7FAE0/000000?text=+) |
| green_30   | #B7EFC3 | ![#B7EFC3](https://via.placeholder.com/100x15/B7EFC3/000000?text=+) |
| green_40   | #78DA90 | ![#78DA90](https://via.placeholder.com/100x15/78DA90/000000?text=+) |
| green_50   | #2DC26D | ![#2DC26D](https://via.placeholder.com/100x15/2DC26D/000000?text=+) |
| green_60   | #00AB56 | ![#00AB56](https://via.placeholder.com/100x15/00AB56/000000?text=+) |
| green_70   | #079449 | ![#079449](https://via.placeholder.com/100x15/079449/000000?text=+) |
| green_80   | #007D3A | ![#007D3A](https://via.placeholder.com/100x15/007D3A/000000?text=+) |
| green_90   | #04592C | ![#04592C](https://via.placeholder.com/100x15/04592C/000000?text=+) |
| green_100  | #03401F | ![#03401F](https://via.placeholder.com/100x15/03401F/000000?text=+) |
| red_10     | #FFF0F1 | ![#FFF0F1](https://via.placeholder.com/100x15/FFF0F1/000000?text=+) |
| red_20     | #FFDBDE | ![#FFDBDE](https://via.placeholder.com/100x15/FFDBDE/000000?text=+) |
| red_30     | #FFB8BC | ![#FFB8BC](https://via.placeholder.com/100x15/FFB8BC/000000?text=+) |
| red_40     | #FF99A0 | ![#FF99A0](https://via.placeholder.com/100x15/FF99A0/000000?text=+) |
| red_50     | #FF707A | ![#FF707A](https://via.placeholder.com/100x15/FF707A/000000?text=+) |
| red_60     | #FF424E | ![#FF424E](https://via.placeholder.com/100x15/FF424E/000000?text=+) |
| red_70     | #D93843 | ![#D93843](https://via.placeholder.com/100x15/D93843/000000?text=+) |
| red_80     | #BF1D28 | ![#BF1D28](https://via.placeholder.com/100x15/BF1D28/000000?text=+) |
| red_90     | #910F17 | ![#910F17](https://via.placeholder.com/100x15/910F17/000000?text=+) |
| red_100    | #6E0B12 | ![#6E0B12](https://via.placeholder.com/100x15/6E0B12/000000?text=+) |
| yellow_10  | #FFFCED | ![#FFFCED](https://via.placeholder.com/100x15/FFFCED/000000?text=+) |
| yellow_20  | #FFF5C7 | ![#FFF5C7](https://via.placeholder.com/100x15/FFF5C7/000000?text=+) |
| yellow_30  | #FFE880 | ![#FFE880](https://via.placeholder.com/100x15/FFE880/000000?text=+) |
| yellow_40  | #FFD530 | ![#FFD530](https://via.placeholder.com/100x15/FFD530/000000?text=+) |
| yellow_50  | #FFC400 | ![#FFC400](https://via.placeholder.com/100x15/FFC400/000000?text=+) |
| yellow_60  | #FFB700 | ![#FFB700](https://via.placeholder.com/100x15/FFB700/000000?text=+) |
| orange_10  | #FFF2E5 | ![#FFF2E5](https://via.placeholder.com/100x15/FFF2E5/000000?text=+) |
| orange_20  | #FFE2C6 | ![#FFE2C6](https://via.placeholder.com/100x15/FFE2C6/000000?text=+) |
| orange_30  | #FFD1A4 | ![#FFD1A4](https://via.placeholder.com/100x15/FFD1A4/000000?text=+) |
| orange_40  | #FFB56C | ![#FFB56C](https://via.placeholder.com/100x15/FFB56C/000000?text=+) |
| orange_50  | #FF9F41 | ![#FF9F41](https://via.placeholder.com/100x15/FF9F41/000000?text=+) |
| orange_60  | #FC820A | ![#FC820A](https://via.placeholder.com/100x15/FC820A/000000?text=+) |