手册版本 V5.0

颜色介绍

GraceUI 在 5.0.1.3 [ 2021.03.19 发布的版本 ] 版本添加了内置颜色库，位置 : /GraceUI5/css/colors.css。
您可以使用它们，也可以在基础上添加、改进出一份更符合自己要求的颜色库（方法 : 复制一份 colors.css 名称为自己的 .css 改进后使用）

注意事项

核心样式 graceUI.css 内已经提供了一些基础颜色

/* 背景色 */
.gui-bg-red{background-color:#EE0A25 !important;}
.gui-bg-green{background-color:#07C160 !important;}
.gui-bg-blue{background-color:#008AFF !important;}
.gui-bg-orange{background-color:#ED6A0C !important;}
.gui-bg-yellow{background-color:#FBDE4E !important;}
.gui-bg-purple{background-color:#8A3FD4 !important;}
.gui-bg-white{background-color:#FFFFFF !important;}
.gui-bg-black{background-color:#2B2E3D !important;}
.gui-bg-black{background-color:#2B2E3D !important;}
.gui-bg-black2{background-color:#656565 !important;}
.gui-bg-black3{background-color:#969799 !important;}
.gui-bg-black4{background-color:#C8C9CC !important;}
.gui-bg-black-opacity7{background-color:rgba(0,0,0,0.7);}
.gui-bg-black-opacity5{background-color:rgba(0,0,0,0.5);}
.gui-bg-black-opacity3{background-color:rgba(0,0,0,0.3);}
.gui-gtbg-red{background-image:linear-gradient(45deg, #FF0066 , #D50000) !important;}
.gui-gtbg-blue{background-image:linear-gradient(45deg, #5887DF , #008AFF) !important;}
.gui-gtbg-green{background-image:linear-gradient(45deg, #39B55A , #8DC63E) !important;}
.gui-bg-gray{background-color:#F7F8FA !important;}
.gui-bg-white{background-color:#FFFFFF !important;}
/* 内置颜色 */
.gui-color-black{color:#2B2E3D !important;}
.gui-color-white{color:#FFFFFF !important;}
.gui-color-gray{color:rgba(69, 90, 100, 0.6) !important;}
.gui-color-gray-light{color:rgba(69, 90, 100, 0.3) !important;}
.gui-color-blue{color:#008AFF !important;}
.gui-color-red{color:#EE0A25 !important;}
.gui-color-orange{color:#ED6A0C !important;}
.gui-color-purple{color:#8A3FD4 !important;}
.gui-color-green{color:#39B55A !important;}

请在项目颜色较为复杂的情况下使用 colors.css，或者建议您查看 colors.css 颜色效果（ hx 编辑器内代开 colors.css 就可以看到颜色 ），把需要的颜色样式复制到 app.vue 的 style 内或者自定义皮肤样式内使用。

兼容平台

使用方法

演示代码