@oas-ui/theme
v2.3.1
Published
OAS-UI 主题 token(light/dark/high-contrast 语义 CSS 变量)
Downloads
1,823
Maintainers
Readme
@oas-ui/theme
中文 | English
OAS-UI 设计 token 包 —— CSS 变量体系:light / dark / high-contrast 三套主题色板、间距、字号、圆角等。通过 html[data-theme="dark"] 切换主题。
安装
pnpm add @oas-ui/theme使用
CDN 引入:
<link rel="stylesheet" href="https://unpkg.com/@oas-ui/theme@2/index.css" />包管理方式:
import '@oas-ui/theme'切换主题只需修改根节点属性:
document.documentElement.dataset.theme = 'dark' // light | dark | high-contrast相关包
| 包 | 作用 |
| --- | --- |
| @oas-ui/ui | 组件库主包(基于本包 token 构建) |
中文 | English
@oas-ui/theme — the design token package of OAS-UI. A CSS variable system: light / dark / high-contrast color palettes, spacing, font sizes, radii, etc. Switch themes via html[data-theme="dark"].
Install
pnpm add @oas-ui/themeUsage
CDN:
<link rel="stylesheet" href="https://unpkg.com/@oas-ui/theme@2/index.css" />Via a package manager:
import '@oas-ui/theme'Switch themes by setting the root attribute:
document.documentElement.dataset.theme = 'dark' // light | dark | high-contrastRelated packages
| Package | Purpose |
| --- | --- |
| @oas-ui/ui | Main UI library (built on this package's tokens) |
