# Colors

**Kind:** Object

Airtable color names.

To get the corresponding RGB or HEX values, use
`getRgbForColor` or `getHexForColor`.

You can also pass these values into the color props for components:

```js
import {colors, colorUtils} from '@airtable/blocks/interface/ui';

<div style={{backgroundColor: colorUtils.getHexForColor(colors.BLUE)}}>Hello world</div>
```

## Members

- `BLUE` = ` 'blue' as const`
- `BLUE_BRIGHT` = ` 'blueBright' as const`
- `BLUE_DARK_1` = ` 'blueDark1' as const`
- `BLUE_LIGHT_1` = ` 'blueLight1' as const`
- `BLUE_LIGHT_2` = ` 'blueLight2' as const`
- `CYAN` = ` 'cyan' as const`
- `CYAN_BRIGHT` = ` 'cyanBright' as const`
- `CYAN_DARK_1` = ` 'cyanDark1' as const`
- `CYAN_LIGHT_1` = ` 'cyanLight1' as const`
- `CYAN_LIGHT_2` = ` 'cyanLight2' as const`
- `GRAY` = ` 'gray' as const`
- `GRAY_BRIGHT` = ` 'grayBright' as const`
- `GRAY_DARK_1` = ` 'grayDark1' as const`
- `GRAY_LIGHT_1` = ` 'grayLight1' as const`
- `GRAY_LIGHT_2` = ` 'grayLight2' as const`
- `GREEN` = ` 'green' as const`
- `GREEN_BRIGHT` = ` 'greenBright' as const`
- `GREEN_DARK_1` = ` 'greenDark1' as const`
- `GREEN_LIGHT_1` = ` 'greenLight1' as const`
- `GREEN_LIGHT_2` = ` 'greenLight2' as const`
- `ORANGE` = ` 'orange' as const`
- `ORANGE_BRIGHT` = ` 'orangeBright' as const`
- `ORANGE_DARK_1` = ` 'orangeDark1' as const`
- `ORANGE_LIGHT_1` = ` 'orangeLight1' as const`
- `ORANGE_LIGHT_2` = ` 'orangeLight2' as const`
- `PINK` = ` 'pink' as const`
- `PINK_BRIGHT` = ` 'pinkBright' as const`
- `PINK_DARK_1` = ` 'pinkDark1' as const`
- `PINK_LIGHT_1` = ` 'pinkLight1' as const`
- `PINK_LIGHT_2` = ` 'pinkLight2' as const`
- `PURPLE` = ` 'purple' as const`
- `PURPLE_BRIGHT` = ` 'purpleBright' as const`
- `PURPLE_DARK_1` = ` 'purpleDark1' as const`
- `PURPLE_LIGHT_1` = ` 'purpleLight1' as const`
- `PURPLE_LIGHT_2` = ` 'purpleLight2' as const`
- `RED` = ` 'red' as const`
- `RED_BRIGHT` = ` 'redBright' as const`
- `RED_DARK_1` = ` 'redDark1' as const`
- `RED_LIGHT_1` = ` 'redLight1' as const`
- `RED_LIGHT_2` = ` 'redLight2' as const`
- `TEAL` = ` 'teal' as const`
- `TEAL_BRIGHT` = ` 'tealBright' as const`
- `TEAL_DARK_1` = ` 'tealDark1' as const`
- `TEAL_LIGHT_1` = ` 'tealLight1' as const`
- `TEAL_LIGHT_2` = ` 'tealLight2' as const`
- `YELLOW` = ` 'yellow' as const`
- `YELLOW_BRIGHT` = ` 'yellowBright' as const`
- `YELLOW_DARK_1` = ` 'yellowDark1' as const`
- `YELLOW_LIGHT_1` = ` 'yellowLight1' as const`
- `YELLOW_LIGHT_2` = ` 'yellowLight2' as const`