本站可以换主题

顶栏那个调色板图标里藏着什么:深浅色、四档页面背景、可以自己调的主色,以及首页卡片的排序。

站点做了几套外观,但入口是个图标,不点开不知道里面有东西。所以写一篇说明,把顶栏那个调色板里的选项讲一遍。

一、按钮在哪

顶栏右侧固定三个图标,手机上也是这三个,没有折进汉堡菜单:

图标作用
放大镜全站搜索
调色板本文说的这些
头像登录 / 账号

点中间那个调色板,面板会从按钮下方展开。

后面会讲到的「极简」档是个例外:那一档只留放大镜和调色板两个图标,头像收起来了。调色板任何时候都在,不然切进去就出不来了。

二、深色还是浅色

面板最上面一排三个键:「亮色」「暗色」「系统」。

默认是「系统」,跟着你操作系统的深浅色设置走,而且是实时跟随——你在系统设置里切换的那一刻页面就变了,不用刷新页面。想固定成某一种,就选另外两个。

代码块的配色也跟着这一项走:亮色下用浅色代码块,暗色下才是深色的。以前不管页面多亮,代码块都是一块黑板,现在不会了。

三、页面背景有四档

这是变化最大的一项。它不只是换个底色:

档位长什么样
极光模糊的彩色光斑,站点默认,主色可以自己调
天光一层平缓的渐变,安静一些,自带配好的主色
纸墨纸质印刷品的样子,连字体一起换
极简在纸墨的基础上再把界面本身减掉,连导航和页面结构都变

四个选项排成两行,左边各有一个小圆球,是实时预览——极光那个会跟着你当前挑的主色变。上面一行是有彩色背景的两档,下面一行是纸面的两档。

关于纸墨

这一档改得最多,值得单独说几句。

底色是羊皮纸色而不是纯白,卡片比页底再亮一档,两者之间靠一条极淡的暖色描边分开,而不是靠阴影。全站只留一种彩色,墨蓝,而且只出现在按钮、链接和标题左边那道竖条上。毛玻璃全部关掉,圆角收小——印刷品的边角是切出来的,不是磨出来的。

字体也换:这一档整页只用霞鹜文楷一个字体,中文、英文、数字、标点全从它出,所以行与行之间不会因为字体不同而高低不齐。代码块另外换成 JetBrains Mono。两者都是本来就有的,不为换主题多下载一份。

代码块的外框、头部栏和按钮也跟着这一档的暖色走,圆角一起收小,和正文是同一套材质。

深色状态下的纸墨不是纯黑,是偏暖的炭色。

这一档的配色和排版约束参考了 tw93 的 kami

关于极简

纸墨换的是材质,极简换的是结构。它是四档里唯一会改变页面上有什么的一档,所以单独说清楚,免得你以为是站坏了。

先说它拿掉了什么:

位置极简档下
顶栏只剩 Home、Categories、About 三项,全英文
首页不再是卡片墙,直接就是文章列表
文章页只剩标题、分类、日期和正文
页脚只剩顶栏那三个链接

文章页收得最狠:副标题、标签、右侧目录、回到顶部的浮钮都不出现,评论区也不显示。想留言的话切回别的档就有了。

原来首页上的名片、最近更新、站点统计三张卡没有删,搬到了关于页;而关于页原本那些自我介绍和服务说明,在这一档不显示。换句话说,这一档的「关于」是站点信息,不是个人简介。

字体也换了,用的是仓耳今楷,和纸墨的霞鹜文楷同属楷体但笔锋更硬。字号比别的档小一档、字距撑开一点,是照着长文阅读调的。还有一处很容易被忽略但其实最影响观感:链接不是蓝色,而是正文色淡一档——整页读下来没有一处彩色打断视线。

这一档整体参考了 tw93.fun。上面那些取舍,包括「链接不用彩色」和「首页就是文章列表」,都是从那儿学来的。

四、主色可以自己调

选中极光时,面板下方会展开一条彩虹滑杆。拖动它改的是全站主色:背景光斑、站点名、链接悬停、归档时间轴都会跟着变。

滑杆只能改色相,饱和度和亮度是固定的。这不是偷懒——极光背景是一层很大的模糊,浅淡的颜色透过去会糊成一团雾,看不出是什么颜色。把浓度锁住,才能保证拖到任何位置都是一个立得住的颜色。

滑杆右边那个数字是当前的色相值,顺手点一下它就能回到默认色。滑杆没有刻度,靠手拖是回不准的。

切到天光、纸墨或极简时这条滑杆会收起来,因为那三档自带配好的主色,不需要也不应该再手动挑。极简那档更彻底,它的「主色」就是正文的墨色,整档没有第二种颜色。

五、首页的卡片可以自己排

只有在首页,面板底部会多出一个「编辑卡片」开关。打开之后,每张卡片下方会出现「上移 / 下移 / 删除」,可以把不关心的模块收掉、把常看的提到前面。旁边的「重置卡片布局」可以还原。

这个开关是临时的,离开首页或者刷新就会关掉,但你排好的顺序会留着。

极简档没有这一节:那一档的首页是文章列表,一张卡都没有,开关自然也就不出现了。你在别的档排好的顺序不会因此丢掉,切回去还在。

六、这些设置存在哪

全部存在你自己浏览器的本地存储里,不上传、不需要登录、也没有任何追踪。

所以有两个后果:换一台设备或者换一个浏览器,要重新设一次;清理浏览器数据的时候会一起被清掉。

另外,这些设置是在页面画出第一帧之前就读好并应用上的,所以刷新时不会先闪一下默认配色再跳到你选的那套。

七、顺带一提

如果你在系统里开了「减少动效」,站上所有的展开、淡入、位移都会自动关掉。关掉之后内容是直接可见可用的,不会出现「因为动画没播,所以内容一直不显示」那种情况。

评论

评论加载中……

登录后再评论

注册要用邮箱收个验证码,只为确认邮箱能收信,不会拿去做别的。账号设置

先选一种读起来舒服的样子

随时可以改:右上角那个调色盘图标里还有天光、极简两档,也能调深浅色和主色。