排版

文本颜色

用于控制元素的文字颜色的功能类。

使用前缀

为了防止和开发者项目中的其他原子化样式语法冲突，样式库默认添加了前缀 lwu，使用示例如下：

vue

<view class="lwu-flex"></view>

语法

TIP

文本颜色已内置暗黑模式的支持
在文本色class后面紧跟 dark 即可实现暗黑模式，示例如下：
html
```
<view class="lwu-white dark"></view>
```

Class	Properties	平台兼容性说明
transparent Aa	color: transparent;	H5、小程序、app-vue
current Aa	color: currentColor;	H5、小程序、app-vue、app-nvue
black Aa	color: #000000;	H5、小程序、app-vue、app-nvue
white Aa	color: #FFFFFF;	H5、小程序、app-vue、app-nvue

Grey / 中性灰

Class	Properties	平台兼容性说明
grey-0 Aa	color: #f7f8fa;	H5、小程序、app-vue、app-nvue
grey-1 Aa	color: #f2f3f5;	H5、小程序、app-vue、app-nvue
grey-2 Aa	color: #e5e6eb;	H5、小程序、app-vue、app-nvue
grey-3 Aa	color: #c9cdd4;	H5、小程序、app-vue、app-nvue
grey-4 Aa	color: #a9aeb8;	H5、小程序、app-vue、app-nvue
grey-5 Aa	color: #86909c;	H5、小程序、app-vue、app-nvue
grey-6 Aa	color: #6b7785;	H5、小程序、app-vue、app-nvue
grey-7 Aa	color: #4e5969;	H5、小程序、app-vue、app-nvue
grey-8 Aa	color: #272e3b;	H5、小程序、app-vue、app-nvue
grey-9 Aa	color: #1d2129;	H5、小程序、app-vue、app-nvue

Red / 浪漫红

Class	Properties	平台兼容性说明
red-0 Aa	color: #FFECE8;	H5、小程序、app-vue、app-nvue
red-1 Aa	color: #FDCDC5;	H5、小程序、app-vue、app-nvue
red-2 Aa	color: #FBACA3;	H5、小程序、app-vue、app-nvue
red-3 Aa	color: #F98981;	H5、小程序、app-vue、app-nvue
red-4 Aa	color: #F76560;	H5、小程序、app-vue、app-nvue
red-5 Aa	color: #F53F3F;	H5、小程序、app-vue、app-nvue
red-6 Aa	color: #CB272D;	H5、小程序、app-vue、app-nvue
red-7 Aa	color: #A1151E;	H5、小程序、app-vue、app-nvue
red-8 Aa	color: #770813;	H5、小程序、app-vue、app-nvue
red-9 Aa	color: #4D000A;	H5、小程序、app-vue、app-nvue

Orangered / 晚秋红

Class	Properties	平台兼容性说明
orangered-0 Aa	color: #FFF3E8;	H5、小程序、app-vue、app-nvue
orangered-1 Aa	color: #FDDDC3;	H5、小程序、app-vue、app-nvue
orangered-2 Aa	color: #FCC59F;	H5、小程序、app-vue、app-nvue
orangered-3 Aa	color: #FAAC7B;	H5、小程序、app-vue、app-nvue
orangered-4 Aa	color: #F99057;	H5、小程序、app-vue、app-nvue
orangered-5 Aa	color: #F77234;	H5、小程序、app-vue、app-nvue
orangered-6 Aa	color: #CC5120;	H5、小程序、app-vue、app-nvue
orangered-7 Aa	color: #A23511;	H5、小程序、app-vue、app-nvue
orangered-8 Aa	color: #771F06;	H5、小程序、app-vue、app-nvue
orangered-9 Aa	color: #4D0E00;	H5、小程序、app-vue、app-nvue

Orange / 活力橙

Class	Properties	平台兼容性说明
orange-0 Aa	color: #FFF7E8;	H5、小程序、app-vue、app-nvue
orange-1 Aa	color: #FFE4BA;	H5、小程序、app-vue、app-nvue
orange-2 Aa	color: #FFCF8B;	H5、小程序、app-vue、app-nvue
orange-3 Aa	color: #FFB65D;	H5、小程序、app-vue、app-nvue
orange-4 Aa	color: #FF9A2E;	H5、小程序、app-vue、app-nvue
orange-5 Aa	color: #FF7D00;	H5、小程序、app-vue、app-nvue
orange-6 Aa	color: #D25F00;	H5、小程序、app-vue、app-nvue
orange-7 Aa	color: #A64500;	H5、小程序、app-vue、app-nvue
orange-8 Aa	color: #792E00;	H5、小程序、app-vue、app-nvue
orange-9 Aa	color: #4D1B00;	H5、小程序、app-vue、app-nvue

Gold / 黄昏色

Class	Properties	平台兼容性说明
gold-0 Aa	color: #FFFCE8;	H5、小程序、app-vue、app-nvue
gold-1 Aa	color: #FDF4BF;	H5、小程序、app-vue、app-nvue
gold-2 Aa	color: #FCE996;	H5、小程序、app-vue、app-nvue
gold-3 Aa	color: #FADC6D;	H5、小程序、app-vue、app-nvue
gold-4 Aa	color: #F9CC45;	H5、小程序、app-vue、app-nvue
gold-5 Aa	color: #F7BA1E;	H5、小程序、app-vue、app-nvue
gold-6 Aa	color: #CC9213;	H5、小程序、app-vue、app-nvue
gold-7 Aa	color: #A26D0A;	H5、小程序、app-vue、app-nvue
gold-8 Aa	color: #774B04;	H5、小程序、app-vue、app-nvue
gold-9 Aa	color: #4D2D00;	H5、小程序、app-vue、app-nvue

Yellow / 柠檬黄

Class	Properties	平台兼容性说明
yellow-0 Aa	color: #FEFFE8;	H5、小程序、app-vue、app-nvue
yellow-1 Aa	color: #FEFEBE;	H5、小程序、app-vue、app-nvue
yellow-2 Aa	color: #FDFA94;	H5、小程序、app-vue、app-nvue
yellow-3 Aa	color: #FCF26B;	H5、小程序、app-vue、app-nvue
yellow-4 Aa	color: #FBE842;	H5、小程序、app-vue、app-nvue
yellow-5 Aa	color: #FADC19;	H5、小程序、app-vue、app-nvue
yellow-6 Aa	color: #CFAF0F;	H5、小程序、app-vue、app-nvue
yellow-7 Aa	color: #A38408;	H5、小程序、app-vue、app-nvue
yellow-8 Aa	color: #785D03;	H5、小程序、app-vue、app-nvue
yellow-9 Aa	color: #4D3800;	H5、小程序、app-vue、app-nvue

Lime / 新生绿

Class	Properties	平台兼容性说明
lime-0 Aa	color: #FCFFE8;	H5、小程序、app-vue、app-nvue
lime-1 Aa	color: #EDF8BB;	H5、小程序、app-vue、app-nvue
lime-2 Aa	color: #DCF190;	H5、小程序、app-vue、app-nvue
lime-3 Aa	color: #C9E968;	H5、小程序、app-vue、app-nvue
lime-4 Aa	color: #B5E241;	H5、小程序、app-vue、app-nvue
lime-5 Aa	color: #9FDB1D;	H5、小程序、app-vue、app-nvue
lime-6 Aa	color: #7EB712;	H5、小程序、app-vue、app-nvue
lime-7 Aa	color: #5F940A;	H5、小程序、app-vue、app-nvue
lime-8 Aa	color: #437004;	H5、小程序、app-vue、app-nvue
lime-9 Aa	color: #2A4D00;	H5、小程序、app-vue、app-nvue

Green / 翡翠绿

Class	Properties	平台兼容性说明
green-0 Aa	color: #E8FFF3;	H5、小程序、app-vue、app-nvue
green-1 Aa	color: #B0F2D2;	H5、小程序、app-vue、app-nvue
green-2 Aa	color: #7DE4B6;	H5、小程序、app-vue、app-nvue
green-3 Aa	color: #4ED79E;	H5、小程序、app-vue、app-nvue
green-4 Aa	color: #25C98A;	H5、小程序、app-vue、app-nvue
green-5 Aa	color: #00BC79;	H5、小程序、app-vue、app-nvue
green-6 Aa	color: #00A06D;	H5、小程序、app-vue、app-nvue
green-7 Aa	color: #00845F;	H5、小程序、app-vue、app-nvue
green-8 Aa	color: #00684E;	H5、小程序、app-vue、app-nvue
green-9 Aa	color: #004D3C;	H5、小程序、app-vue、app-nvue

Cyan / 碧涛青

Class	Properties	平台兼容性说明
cyan-0 Aa	color: #E8FFFB;	H5、小程序、app-vue、app-nvue
cyan-1 Aa	color: #B7F4EC;	H5、小程序、app-vue、app-nvue
cyan-2 Aa	color: #89E9E0;	H5、小程序、app-vue、app-nvue
cyan-3 Aa	color: #5EDFD6;	H5、小程序、app-vue、app-nvue
cyan-4 Aa	color: #37D4CF;	H5、小程序、app-vue、app-nvue
cyan-5 Aa	color: #14C9C9;	H5、小程序、app-vue、app-nvue
cyan-6 Aa	color: #0DA5AA;	H5、小程序、app-vue、app-nvue
cyan-7 Aa	color: #07828B;	H5、小程序、app-vue、app-nvue
cyan-8 Aa	color: #03616C;	H5、小程序、app-vue、app-nvue
cyan-9 Aa	color: #00424D;	H5、小程序、app-vue、app-nvue

Blue / 海空蓝

Class	Properties	平台兼容性说明
blue-0 Aa	color: #E8F7FF;	H5、小程序、app-vue、app-nvue
blue-1 Aa	color: #C3E7FE;	H5、小程序、app-vue、app-nvue
blue-2 Aa	color: #9FD4FD;	H5、小程序、app-vue、app-nvue
blue-3 Aa	color: #7BC0FC;	H5、小程序、app-vue、app-nvue
blue-4 Aa	color: #57A9FB;	H5、小程序、app-vue、app-nvue
blue-5 Aa	color: #3491FA;	H5、小程序、app-vue、app-nvue
blue-6 Aa	color: #206CCF;	H5、小程序、app-vue、app-nvue
blue-7 Aa	color: #114BA3;	H5、小程序、app-vue、app-nvue
blue-8 Aa	color: #063078;	H5、小程序、app-vue、app-nvue
blue-9 Aa	color: #001A4D;	H5、小程序、app-vue、app-nvue

Deepblue / 极致蓝

Class	Properties	平台兼容性说明
deepblue-0 Aa	color: #E8F3FF;	H5、小程序、app-vue、app-nvue
deepblue-1 Aa	color: #BEDAFF;	H5、小程序、app-vue、app-nvue
deepblue-2 Aa	color: #94BFFF;	H5、小程序、app-vue、app-nvue
deepblue-3 Aa	color: #6AA1FF;	H5、小程序、app-vue、app-nvue
deepblue-4 Aa	color: #4080FF;	H5、小程序、app-vue、app-nvue
deepblue-5 Aa	color: #165DFF;	H5、小程序、app-vue、app-nvue
deepblue-6 Aa	color: #0E42D2;	H5、小程序、app-vue、app-nvue
deepblue-7 Aa	color: #072CA6;	H5、小程序、app-vue、app-nvue
deepblue-8 Aa	color: #031A79;	H5、小程序、app-vue、app-nvue
deepblue-9 Aa	color: #000D4D;	H5、小程序、app-vue、app-nvue

Purple / 暗夜紫

Class	Properties	平台兼容性说明
purple-0 Aa	color: #F5E8FF;	H5、小程序、app-vue、app-nvue
purple-1 Aa	color: #DDBEF6;	H5、小程序、app-vue、app-nvue
purple-2 Aa	color: #C396ED;	H5、小程序、app-vue、app-nvue
purple-3 Aa	color: #A871E3;	H5、小程序、app-vue、app-nvue
purple-4 Aa	color: #8D4EDA;	H5、小程序、app-vue、app-nvue
purple-5 Aa	color: #722ED1;	H5、小程序、app-vue、app-nvue
purple-6 Aa	color: #551DB0;	H5、小程序、app-vue、app-nvue
purple-7 Aa	color: #3C108F;	H5、小程序、app-vue、app-nvue
purple-8 Aa	color: #27066E;	H5、小程序、app-vue、app-nvue
purple-9 Aa	color: #16004D;	H5、小程序、app-vue、app-nvue

Pinkpurple / 青春紫

Class	Properties	平台兼容性说明
pinkpurple-0 Aa	color: #FFE8FB;	H5、小程序、app-vue、app-nvue
pinkpurple-1 Aa	color: #F7BAEF;	H5、小程序、app-vue、app-nvue
pinkpurple-2 Aa	color: #F08EE6;	H5、小程序、app-vue、app-nvue
pinkpurple-3 Aa	color: #E865DF;	H5、小程序、app-vue、app-nvue
pinkpurple-4 Aa	color: #E13EDB;	H5、小程序、app-vue、app-nvue
pinkpurple-5 Aa	color: #D91AD9;	H5、小程序、app-vue、app-nvue
pinkpurple-6 Aa	color: #B010B6;	H5、小程序、app-vue、app-nvue
pinkpurple-7 Aa	color: #8A0993;	H5、小程序、app-vue、app-nvue
pinkpurple-8 Aa	color: #650370;	H5、小程序、app-vue、app-nvue
pinkpurple-9 Aa	color: #42004D;	H5、小程序、app-vue、app-nvue

magenta / 品红色

Class	Properties	平台兼容性说明
magenta-0 Aa	color: #FFE8F1;	H5、小程序、app-vue、app-nvue
magenta-1 Aa	color: #FDC2DB;	H5、小程序、app-vue、app-nvue
magenta-2 Aa	color: #FB9DC7;	H5、小程序、app-vue、app-nvue
magenta-3 Aa	color: #F979B7;	H5、小程序、app-vue、app-nvue
magenta-4 Aa	color: #F754A8;	H5、小程序、app-vue、app-nvue
magenta-5 Aa	color: #F5319D;	H5、小程序、app-vue、app-nvue
magenta-6 Aa	color: #CB1E83;	H5、小程序、app-vue、app-nvue
magenta-7 Aa	color: #A11069;	H5、小程序、app-vue、app-nvue
magenta-8 Aa	color: #77064F;	H5、小程序、app-vue、app-nvue
magenta-9 Aa	color: #4D0034;	H5、小程序、app-vue、app-nvue

功能色

使用场景

0-白底悬浮
1-文字禁用
2-一般禁用
3-特殊场景
5-常规使用
6-点击状态

Primary-品牌色

Class	Properties	平台兼容性说明
primary-0 Aa	color: #E8FFF3;	H5、小程序、app-vue、app-nvue
primary-1 Aa	color: #B0F2D2;	H5、小程序、app-vue、app-nvue
primary-2 Aa	color: #7DE4B6;	H5、小程序、app-vue、app-nvue
primary-3 Aa	color: #4ED79E;	H5、小程序、app-vue、app-nvue
primary-5 Aa	color: #00BC79;	H5、小程序、app-vue、app-nvue
primary-6 Aa	color: #00A06D;	H5、小程序、app-vue、app-nvue

Success-成功色

Class	Properties	平台兼容性说明
success-0 Aa	color: #E8FFF3;	H5、小程序、app-vue、app-nvue
success-1 Aa	color: #B0F2D2;	H5、小程序、app-vue、app-nvue
success-2 Aa	color: #7DE4B6;	H5、小程序、app-vue、app-nvue
success-3 Aa	color: #4ED79E;	H5、小程序、app-vue、app-nvue
success-5 Aa	color: #00BC79;	H5、小程序、app-vue、app-nvue
success-6 Aa	color: #00A06D;	H5、小程序、app-vue、app-nvue

Danger / 危险色

Class	Properties	平台兼容性说明
danger-0 Aa	color: #FFECE8;	H5、小程序、app-vue、app-nvue
danger-1 Aa	color: #FDCDC5;	H5、小程序、app-vue、app-nvue
danger-2 Aa	color: #FBACA3;	H5、小程序、app-vue、app-nvue
danger-3 Aa	color: #F98981;	H5、小程序、app-vue、app-nvue
danger-5 Aa	color: #F53F3F;	H5、小程序、app-vue、app-nvue
danger-6 Aa	color: #CB272D;	H5、小程序、app-vue、app-nvue

Warning / 警告色

Class	Properties	平台兼容性说明
warning-0 Aa	color: #FFF7E8;	H5、小程序、app-vue、app-nvue
warning-1 Aa	color: #FFE4BA;	H5、小程序、app-vue、app-nvue
warning-2 Aa	color: #FFCF8B;	H5、小程序、app-vue、app-nvue
warning-3 Aa	color: #FFB65D;	H5、小程序、app-vue、app-nvue
warning-5 Aa	color: #FF7D00;	H5、小程序、app-vue、app-nvue
warning-6 Aa	color: #D25F00;	H5、小程序、app-vue、app-nvue

Link / 链接色

Class	Properties	平台兼容性说明
link-0 Aa	color: #E8F7FF;	H5、小程序、app-vue、app-nvue
link-1 Aa	color: #C3E7FE;	H5、小程序、app-vue、app-nvue
link-2 Aa	color: #9FD4FD;	H5、小程序、app-vue、app-nvue
link-3 Aa	color: #7BC0FC;	H5、小程序、app-vue、app-nvue
link-5 Aa	color: #3491FA;	H5、小程序、app-vue、app-nvue
link-6 Aa	color: #206CCF;	H5、小程序、app-vue、app-nvue

Info / 信息色

Class	Properties	平台兼容性说明
info-0 Aa	color: #E8F7FF;	H5、小程序、app-vue、app-nvue
info-1 Aa	color: #C3E7FE;	H5、小程序、app-vue、app-nvue
info-2 Aa	color: #9FD4FD;	H5、小程序、app-vue、app-nvue
info-3 Aa	color: #7BC0FC;	H5、小程序、app-vue、app-nvue
info-5 Aa	color: #3491FA;	H5、小程序、app-vue、app-nvue
info-6 Aa	color: #206CCF;	H5、小程序、app-vue、app-nvue

排版 ​

文本颜色 ​

使用前缀 ​

语法 ​

Grey / 中性灰 ​

Red / 浪漫红 ​

Orangered / 晚秋红 ​

Orange / 活力橙 ​

Gold / 黄昏色 ​

Yellow / 柠檬黄 ​

Lime / 新生绿 ​

Green / 翡翠绿 ​

Cyan / 碧涛青 ​

Blue / 海空蓝 ​

Deepblue / 极致蓝 ​

Purple / 暗夜紫 ​

Pinkpurple / 青春紫 ​

magenta / 品红色 ​

功能色 ​

Primary-品牌色 ​

Success-成功色 ​

Danger / 危险色 ​

Warning / 警告色 ​

Link / 链接色 ​

Info / 信息色 ​

排版

文本颜色

使用前缀

语法

Grey / 中性灰

Red / 浪漫红

Orangered / 晚秋红

Orange / 活力橙

Gold / 黄昏色

Yellow / 柠檬黄

Lime / 新生绿

Green / 翡翠绿

Cyan / 碧涛青

Blue / 海空蓝

Deepblue / 极致蓝

Purple / 暗夜紫

Pinkpurple / 青春紫

magenta / 品红色

功能色

Primary-品牌色

Success-成功色

Danger / 危险色

Warning / 警告色

Link / 链接色

Info / 信息色