墨观 Inkstone
一套从 526 个中国传统颜色里长出来的代码配色。六个变体共用同一套色相骨架,切换时像同一幅画换了光线。
- VS Code
- Cursor
- Windsurf
- VSCodium
- Ghostty
- Kaku / WezTerm
- OpenCode
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "玄墨", hex: "#14131a",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "玄墨", hex: "#19181e",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "宣纸", hex: "#f7f4ed",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "宣纸", hex: "#e9e2d4",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "沧海", hex: "#0d1822",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
◫
⌕
⑂
▷
◈
theme.ts ×
palette.ts
kaku.lua
1// 墨观 Inkstone · 把传统色写进代码
2import { named } from "./palette";
3
4interface Ink {
5 name: string;
6 hex: `#${string}`;
7}
8
9const 墨色: Ink = {
10 name: "青瓷", hex: "#e8f0ec",
11};
12
13/** 计算 WCAG 对比度 */
14export function contrast(a: Ink, b: Ink): number {
15 const lum = (c: Ink) => {
16 const [r, g, b] = [0, 1, 2].map((i) => channel(c.hex, i));
17 return 0.2126 * r + 0.7152 * g + 0.0722 * b;
18 };
19 const [hi, lo] = [lum(a), lum(b)].sort((x, y) => y - x);
20 return (hi + 0.05) / (lo + 0.05);
21}
22
六套色板都从同一张中国传统色谱里取色。墨纸组以纸墨为底,海瓷组以深海与青瓷釉为底;Dimmed 不是蒙一层灰,而是把房间的灯调暗。
玄墨
配色思路
松烟墨打底,朱砂作批注。深色画布把亮度让给代码,红色只留给需要被看见的地方——适合夜里长时间写代码。
Aa
画布派生色
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文派生色
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标羽扇豆蓝
Aa
关键字海棠红 · 降彩
Aa
函数羽扇豆蓝
Aa
字符串铜绿
Aa
数字杏黄
Aa
类型土黄
Aa
常量杏黄
Aa
注释派生色
Aa
装饰器萝兰紫
Aa
标签山茶红 · 降彩
Aa
错误银朱 · 降彩
玄墨 Dimmed
配色思路
同一方墨,把灯调暗一档。画布更沉、墨色不灰,矿物颜料只退半步饱和度——适合光线柔和的房间。
Aa
画布派生色
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文派生色
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标羽扇豆蓝
Aa
关键字山黎豆红
Aa
函数涧石蓝
Aa
字符串梧枝绿
Aa
数字山鸡黄
Aa
类型土黄
Aa
常量土黄
Aa
注释派生色
Aa
装饰器萝兰紫
Aa
标签白芨红
Aa
错误银朱 · 降彩
宣纸
配色思路
生宣的暖白底色,松烟写字,青绿设色。纸是暖的、墨是冷的,矿物色在中间过渡;关键字用降彩的鹤顶红,像朱批而不是警告。
Aa
画布鱼肚白
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文派生色
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标玉鈫蓝
Aa
关键字鹤顶红 · 降彩
Aa
函数飞燕草蓝
Aa
字符串荷叶绿
Aa
数字蟹蝥红
Aa
类型桔梗紫
Aa
常量蟹蝥红
Aa
注释派生色
Aa
装饰器苍黄
Aa
标签玫瑰紫 · 降彩
Aa
错误尖晶玉红 · 降彩
宣纸 Dimmed
配色思路
陈纸的暖灰,墨色再深一分。像旧书页在下午的光线里:纸不刺眼,颜料褪了半度,但仍认得出每一种颜色。
Aa
画布派生色
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文派生色
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标玉鈫蓝
Aa
关键字烟红
Aa
函数鷃蓝
Aa
字符串荷叶绿
Aa
数字驼色
Aa
类型野菊紫
Aa
常量潭水绿
Aa
注释鼠背灰
Aa
装饰器芓紫
Aa
标签芓紫
Aa
错误殷红
沧海
配色思路
深海暮色作底,青绿矿物铺开,银朱只做海面上的一点反光。冷色画布安静,但不至于单调。
Aa
画布派生色
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文派生色
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标涧石蓝
Aa
关键字银朱 · 降彩
Aa
函数霁青
Aa
字符串竹绿
Aa
数字土黄
Aa
类型萝兰紫
Aa
常量土黄
Aa
注释晚波蓝
Aa
装饰器萝兰紫
Aa
标签山茶红 · 降彩
Aa
错误银朱 · 降彩
青瓷
配色思路
月白釉底,青灰题字,雨过天青。像一件汝窑器:颜色都在釉下,不抢字;适合白天和浅色桌面。
Aa
画布派生色
Aa
面板派生色
Aa
浮起派生色
Aa
浮层派生色
Aa
边框派生色
Aa
正文青灰
Aa
次要文字派生色
Aa
弱化文字派生色
Aa
光标玉鈫蓝
Aa
关键字尖晶玉红 · 降彩
Aa
函数玉鈫蓝
Aa
字符串荷叶绿
Aa
数字驼色
Aa
类型桔梗紫
Aa
常量潭水绿
Aa
注释战舰灰
Aa
装饰器紫灰
Aa
标签芓紫
Aa
错误殷红