Installation

How to install Radix Colors.

Install Radix Colors from your terminal via npm or yarn. Current version is 0.1.7

// with npm
npm install @radix-ui/colors
// with yarn
yarn add @radix-ui/colors

To get started quickly, you can use the CDN files.

// Load whichever light and dark scales you need
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/gray.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/blue.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/green.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/red.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/grayDark.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/blueDark.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/greenDark.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/redDark.css" />

The example above uses the @latest tag to point to the latest version of the scales. You can pin your scales to a specific version.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@0.1.5/blue.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@0.1.5/blueDark.css" />