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" />