前端明暗风颜色转换
该文档说明是在阅读 AntDesign
源码的时,把主题色风格转换模块抽取出来分析并对构建该 DEMO 的思路说明。详情请参考:
构建 WEB 网站主题色系与 UI 统一,UI 组件和 UI 颜色体系一致的系统 DEMO。
- 基于对 AntDesign 框架颜色处理源码探究,版本:
AntDesign-Vue(v1.6x)
- 基于
Less funciton
+HSV
,函数式处理自定义颜色和使用HSV进行明暗度置换。
探讨方向:
- AntDesign 颜色处理分析
- 构建颜色与明暗风切换的系统
技术栈:vuecli/ vue/ less
├── public // 文件放置处
├── src
│ ├── App.vue
│ ├── assets
│ ├── color.js
│ ├── components
│ ├── global.less
│ ├── main.js // 入口
│ ├── styles // 样式存放
│ └── utils
├── vue.config.js
npm run color
yarn install
or npm i
npm run serve