二次元风格很容易做过头。角色图、霓虹、网格、玻璃面板一旦同时加上去,页面就会变成一张很吵的海报,读者很快找不到文章入口。
所以这个站点的颜色系统只保留几种主色:
--color-primary: #46f0bf;
--color-secondary: #93e3ff;
--color-sakura: #ff78a9;
--color-bg-deep: #07151c;
薄荷绿负责品牌记忆,淡天蓝负责空气感,樱粉只用于点缀。深色不是大面积铺开,而是藏在阴影、文字和背景深处,让页面有一点夜间信号房的味道。
我对这套配色有三个要求。
第一,正文必须先过关。标题、摘要、按钮和输入框不能因为背景太花而降低可读性。尤其是文章页,背景可以存在,但不能抢正文的层级。
第二,颜色要服务交互。按钮、标签、焦点状态、表单错误和活动提示都需要稳定的颜色语义,而不是每个组件随手挑一个好看的渐变。
第三,移动端要更克制。桌面可以容纳大背景和角色墙,手机上则应该减少透明图层,让搜索、导航和文章卡片先被看清楚。
这也是为什么站点里很多面板都使用半透明白底和细边框。它们看起来像玻璃,但本质上是在保护文字对比度。视觉氛围是一层外衣,阅读体验才是骨架。
后续如果继续扩展暗色模式,我会先从文本对比、链接状态和卡片层级开始,而不是简单把背景变黑。真正舒服的夜间界面,需要比“反色”多一点耐心。

LETTERS / 评论
讨论区
还没有回应。登录后可以留下第一条评论。
登录后评论 →