Radix Homepage
Radix Homepage
主题主题基础组件基础组件图标图标颜色颜色
文档调色板博客

安装

¥Installation

如何安装 Radix Colors。

npm

通过 npm、yarn 或 pnpm 从终端安装 Radix Colors。当前版本为 3.0.0

¥Install Radix Colors from your terminal via npm, yarn or pnpm. Current version is 3.0.0

# with npm

npm install @radix-ui/colors

# with yarn

yarn add @radix-ui/colors

# with pnpm

pnpm add @radix-ui/colors

CDN

为了快速上手，你可以使用 CDN 文件。

¥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/gray-dark.css"
/>

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

<link
	rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/green-dark.css"
/>

<link
	rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@latest/red-dark.css"
/>

上面的示例使用 @latest 标签指向比例尺的最新版本。你可以将比例尺固定到特定版本。

¥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@3.0.0/blue.css"
/>

<link
	rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/@radix-ui/colors@3.0.0/blue-dark.css"
/>
Next用法