主题
用于主题的设计标志和公用设施,有从一种口音颜色衍生出轻而暗的调色板并坚持偏好.
安装
npm install @3mo/theme
import { Theme } from '@3mo/theme'
使用量
<div class='swatch' style='background: var(--mo-color-background); color: var(--mo-color-foreground)'>Background / Foreground</div>
<div class='swatch' style='background: var(--mo-color-surface); color: var(--mo-color-on-surface)'>Surface</div>
<div class='swatch' style='background: var(--mo-color-surface-container-lowest); color: var(--mo-color-on-surface)'>Surface Container Lowest</div>
<div class='swatch' style='background: var(--mo-color-surface-container-low); color: var(--mo-color-on-surface)'>Surface Container Low</div>
<div class='swatch' style='background: var(--mo-color-surface-container); color: var(--mo-color-on-surface)'>Surface Container</div>
<div class='swatch' style='background: var(--mo-color-surface-container-high); color: var(--mo-color-on-surface)'>Surface Container High</div>
<div class='swatch' style='background: var(--mo-color-surface-container-highest); color: var(--mo-color-on-surface)'>Surface Container Highest</div>
<div class='swatch' style='background: var(--mo-color-red)'>Red</div>
<div class='swatch' style='background: var(--mo-color-green)'>Green</div>
<div class='swatch' style='background: var(--mo-color-yellow)'>Yellow</div>
<div class='swatch' style='background: var(--mo-color-blue)'>Blue</div>
<div class='swatch' style='background: var(--mo-color-gray); color: black'>Gray</div>
<div class='swatch' style='background: var(--mo-color-gray-transparent)'>Gray Transparent</div>
<div class='swatch' style='background: var(--mo-color-transparent-gray-3)'>Transparent Gray</div>
<div class='swatch' style='background: var(--mo-color-accent); color: var(--mo-color-on-accent)'>Accent / On Accent</div>
<div class='swatch' style='background: var(--mo-color-accent-container); color: var(--mo-color-on-accent-container)'>Accent Container / On Accent Container</div>
API 密码
出口
| 名称 | 仁爱 | 说明 |
|---|---|---|
BackgroundStorage | 类 | |
AccentStorage | 类 | |
Theme | 类 | 控制应用程序主题的公用事业 . |
ThemeController | 类 | |
colorContrast | 函数 | 计算与给定的颜色相对的 CSS 颜色,结果为白色或黑色 |
Background | 语句 |
链接
许可证
麻省理工学院 3MO GmbH