Extensions

Press shift + S to search API reference.

Interface

ColorUtils

View source

Utilities for working with Color names from the colors enum.

interface ColorUtils
getHexForColor
function (colorString: Color) => string
function (colorString: string) => null | string

Given a Color, return the hex color value for that color, or null if the value isn't a Color

import {colorUtils, colors} from '@airtable/blocks/ui';
colorUtils.getHexForColor(colors.RED);
// => '#ef3061'
colorUtils.getHexForColor('uncomfortable beige');
// => null
getRgbForColor
function (colorString: Color) => RGB
function (colorString: string) => RGB | null

Given a Color, return an RGB object representing it, or null if the value isn't a Color

import {colorUtils, colors} from '@airtable/blocks/ui';
colorUtils.getRgbForColor(colors.PURPLE_DARK_1);
// => {r: 107, g: 28, b: 176}
colorUtils.getRgbForColor('disgruntled pink');
// => null
shouldUseLightTextOnColor
function (colorString: string) => boolean

Given a Color, returns true or false to indicate whether that color should have light text on top of it when used as a background color.

import {colorUtils, colors} from '@airtable/blocks/ui';
colorUtils.shouldUseLightTextOnColor(colors.PINK_LIGHT_1);
// => false
colorUtils.shouldUseLightTextOnColor(colors.PINK_DARK_1);
// => true