自定义elementui的主题

通常情况下,我们使用elementui框架的时候默认组件的主题都是白色的,比如:

但是如果想自定义主题,改变主题颜色,以及各种默认颜色,其实也不难:

  • 配置默认主题,选好后点击下载

  • 在vue项目的main.js同级目录下新建一个文件:elemen-variables.scss

  • -打开config.json文件,将样式属性复制到elemen-variables.scss,但是格式会有变化,例如:

bash 复制代码
/* 自定义主题色变量 */
$--color-white:#0F045B;
$--color-text-regular:#FFFFFF;

/* 改变 icon 字体路径变量,必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';

@import "~element-ui/packages/theme-chalk/src/index";
相关推荐
gyx_这个杀手不太冷静3 分钟前
大人工智能时代下前端界面全新开发模式的思考(六)
前端·架构·ai编程
yngsqq4 分钟前
编译的dll自动复制到指定目录并重命名
java·服务器·前端
研☆香18 分钟前
聊一聊js中的正则表达式的应用
前端·javascript·正则表达式
开心就好202519 分钟前
使用Edge和ADB进行Android Webview远程调试的完整教程
前端·ios
用泥种荷花40 分钟前
从 0 到 1 做一个支持 NFC 写入的小程序,需要哪些 API?
前端
qq_120840937144 分钟前
Three.js 工程向:Clock、deltaTime 与固定步长主循环
开发语言·javascript·ecmascript
90程序员1 小时前
纯浏览器解析 APK 信息,不用服务器 | 开源了一个小工具
前端·apk
用户11481867894841 小时前
Vosk-Browser 实现浏览器离线语音转文字
前端·javascript
江上清风山间明月1 小时前
Vite现代化的前端构建工具详解
前端·webpack·nodejs·vite
PBitW1 小时前
apijson 让前端自己定义接口 —— 但不推荐
前端·apijson