- Published on
29-Custom UI Themes
- Authors
- Name
- Dendoink
- @Magiciaaaaaaaan
💡
问题 可能你知道怎么更换 Chrome
的网页主题,但是你知道怎么更换 Devtools
的主题吗?
- 这样的主题他不香吗?

1. Custom UI themes 的设置
这是一个实验中的功能,所以你需要设置一下:

2. 下载 devtools 主题
在地址栏键入 https://chrome.google.com/webstore/category/extensions
如果你无法打开的话,可能是因为你的上网方式不够科学~
然后后搜索 devtools theme
,结果是默认显示三个,当然你可以选择查看更多,来选中你心仪的一款主题~

devtools
3.重新打开 
嗯?为什么没有生效呢?如果你和我碰到一样的情况,不用担心,只需要在地址栏输入 chrome://restart
,重启 chrome
。然后在新的页面中,开启 devtools
就可以了。

⚠️
请注意 Restart 会打开你关闭之前的页面,即使你刷新这个被重新打开的页面,再打开 devtools
,主题也不会生效,必须在新的标签页中打开 devtools
才可以。
Related series
00-写在前面
March 2, 2021
01-Chrome 版本
March 2, 2021
02-复制 & 保存
March 2, 2021
03-快捷键和通用技巧
March 2, 2021
04-使用 Command
March 2, 2021
05-代码块的使用
March 2, 2021
06-console 中的 $
March 2, 2021
07-console.log 的 "bug" ?
March 2, 2021
08-异步的 console
March 2, 2021
09-Ninja console.log
March 2, 2021
10-自定义格式转换器
March 2, 2021
11-对象&方法
March 2, 2021
12-console.log 并不简单
March 2, 2021
13-打造一个终极 log
March 2, 2021
14-打印时间戳
March 2, 2021
15-直接把 `log` 作为回调函数
March 2, 2021
16-初窥 Network
March 2, 2021
17-Network 深入
March 2, 2021
18-Network 细节
March 2, 2021
19-元素面板的基本操作
March 2, 2021
20-元素面板调试技巧
March 2, 2021
21-元素面板里的编辑器
March 2, 2021
22-颜色选择器
March 2, 2021
23-Drawer 使用技巧
March 2, 2021
24-Drawer 动画调试
March 2, 2021
25-Drawer 性能优化
March 2, 2021
26-Workspace 使用技巧
March 2, 2021
27-自动美化输出
March 2, 2021
28-CSS 概览
March 2, 2021
29-Custom UI Themes
March 2, 2021
30-Source diff
March 2, 2021