自定义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";
相关推荐
小小小小宇5 分钟前
Claude Code 自动运行方法大全
前端
道友可好7 分钟前
AI 测试全绿,代码却是错的
前端·人工智能·后端
国科安芯26 分钟前
商业航天通信载荷数字处理单元供电架构研究——基于ASP7A84AS的高精度低压差线性稳压器技术分析
前端·单片机·嵌入式硬件·fpga开发·架构·安全性测试
TangentDomain1 小时前
AI 写代码时代,游戏 UI 架构为什么停在 MVP?
前端·游戏·架构
英勇无比的消炎药1 小时前
前端提效神器全新AI组件库TinyRobot改写日常开发模式
前端·vue.js
GuWenyue1 小时前
10分钟搞定TodoList实战!从0搭建Bun+TS的RESTful接口服务
前端·typescript·bun
IMPYLH1 小时前
HTML 的 <a>元素
前端·javascript·html
PedroQue991 小时前
uni-router:uni-app路由管理新选择
前端·uni-app
Cerrda1 小时前
一行指令搞定复制:Vue 3 vCopy 实现解析
前端·代码规范
ZengLiangYi1 小时前
本地向量数据库选型:vectra vs chroma vs hnswlib
javascript·数据库·后端