颜色(Colors)

本章节讲的是sass定制方面的颜色,关于开发中颜色请看最后一章,助手->第一节颜色(Helpers->Colors)。

1

大多数元素和组件都可以使用 is-$color 修饰符来改变颜色,例如 is-primary 或者 is-dark

Bulma 可以通过 $colors Sass map来获得所有的颜色和他们的反色。

颜色 演示 变量 计算值 反色值 反色计算值
White $white $white hsl(0, 0%, 100%) $black hsl(0, 0%, 4%)
Black $black $black hsl(0, 0%, 4%) $white hsl(0, 0%, 100%)
Light $light $white-ter hsl(0, 0%, 96%) $grey-darker hsl(0, 0%, 21%)
Dark $dark $grey-darker hsl(0, 0%, 21%) $white-ter hsl(0, 0%, 96%)
Primary $primary $turquoise hsl(171, 100%, 41%) #fff #fff
Link $link $blue hsl(217, 71%, 53%) #fff #fff
Info $info $cyan hsl(204, 86%, 53%) #fff #fff
Success $success $green hsl(141, 53%, 53%) #fff #fff
Warning $warning $yellow hsl(48, 100%, 67%) rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7)
Danger $danger $red hsl(348, 100%, 61%) #fff #fff

Bulma 还提供了 $shades Sass map, 它仅包含黑白之间的灰色阴影。

颜色 变量
Black bis $black-bis hsl(0, 0%, 7%)
Black ter $black-ter hsl(0, 0%, 14%)
Grey darker $grey-darker hsl(0, 0%, 21%)
Grey dark $grey-dark hsl(0, 0%, 29%)
Grey light $grey-light hsl(0, 0%, 71%)
Grey lighter $grey-lighter hsl(0, 0%, 86%)
White ter $white-ter hsl(0, 0%, 96%)
White bis $white-bis hsl(0, 0%, 98%)

返回头部

23222

问题反馈
返回顶部
(function(){ var src = "https://s.ssl.qhres2.com/ssl/ab77b6ea7f3fbf79.js"; document.write('