The veil at work
Ruled paper and the Tale of the Bamboo Cutter beneath the veil: a glowing stalk among the bamboo.
今は昔、竹取の翁といふものありけり。野山にまじりて竹を取りつつ、よろづのことに使ひけり。名をば、さぬきの造となむいひける。その竹の中に、もと光る竹なむ一筋ありける。あやしがりて、寄りて見るに、筒の中光りたり。それを見れば、三寸ばかりなる人、いとうつくしうてゐたり。翁いふやう、我朝ごと夕ごとに見る竹の中におはするにて知りぬ。子となり給ふべき人なめり、とて手にうち入れて家へ持ちて来ぬ。妻の嫗に預けて養はす。うつくしきこと、かぎりなし。いと幼ければ、籠に入れて養ふ。竹取の翁、竹を取るに、この子を見つけてのちに竹取るに、節を隔てて、よごとに金ある竹を見つくること重なりぬ。かくて翁やうやう豊かになりゆく。この児、養ふほどに、すくすくと大きになりまさる。三月ばかりになるほどに、よき程なる人になりぬれば、髪上げなどさうして、髪上げさせ、裳着す。帳のうちよりも出さず、いつき養ふ。この児のかたち、けうらなること世になく、屋のうちは暗き所なく光満ちたり。翁、心地あしく苦しき時も、この子を見れば、苦しきこともやみぬ。腹立たしきことも慰みけり。翁、竹を取ること久しくなりぬ。勢ひ猛の者になりにけり。この子いと大きになりぬれば、名を、三室戸斎部の秋田を呼びてつけさす。秋田、なよ竹のかぐや姫とつけつ。
Surfaces & marks
Cards, pills, and badges on the glass registers. Semantic tokens switch themes with a single class.
Forms & controls
The glass field carries the full control set. Every focus gets a ruri ring.
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-select.jsonOverlays
Radix sits underneath the veils. Panels float on strong glass over a soft, deep scrim.
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-dialog.jsonStructure
Tabs, accordion, and tables in the washi editorial register.
Semantic tokens switch alone
| Token | Named after | ΔE |
|---|---|---|
| ruri | 瑠璃 — lapis blue | 7.8 |
| korozen | 黄櫨染 — imperial amber | 7.8 |
| sumire | 菫 — violet | 13.0 |
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-tabs.jsonground
#F7F3EC · dark #12130F
紙底 · washi ground
ink
#1C1914 · dark #E9E5DC
標題 · headings
body
#4A443C · dark #B5AFA2
內文 · body text
muted
#6E6659 · dark #A8A193
次要 · secondary text
faint
#9A9184 · dark #7E7869
meta · timestamps
ruri 瑠璃
#2E63B8 · dark #82B4F0
導引 · links, focus, selection
korozen 黄櫨染
#D0722E · dark #F2A36B
行動 · primary CTA, editorial marks
sumire 菫
#7B68C8 · dark #A99BEA
氛圍 · ambient glow, ::selection
deep
#112441 · dark –
hover 深端 · dark button text
Indicators & wayfinding
Understated states and clear wayfinding.
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-pagination.jsonPickers & input
cmdk, day-picker, vaul, and OTP share the same veil.
Loading with ⌘K
Nothing here yet
The empty state is a dashed washi ground that stays quiet.
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-command.jsonChinese & Japanese, first-class
Noto CJK unifies zh/ja glyph forms; display text balances; Japanese headings break at phrase boundaries.
zh-TW 中文
紙為底,紗為層,三色為光
暖紙質感的介面系統——全形標點與中日字形在各平台保持一致,排版不是事後補丁。
ja 日本語
紙の上に、三つの灯り
和紙の温もりを基調に、語節単位の改行と統一された字形で、日本語の組版を最初から考慮した設計です。
npx shadcn@latest add https://washiveil.alexchih.com/r/theme.jsonProse: the ink layer
Article typography with a stance: ruri marks the interactive, korozen marks editorial intent.
← Writing Security · 2026-05-18 · 12 min read
H2 Section heading
H3 Subsection heading
A paragraph shows bold emphasis, italic stress, an inline link, and terraform plan as inline code.
段落展示粗體強調、Latin italic、行內連結與行內 terraform plan。
段落には太字の強調、斜体、インラインリンク、terraform plan のインラインコードが並びます。
「引用はここに——左側の黄櫨染は編集記号です。」- 無序清單 unordered
- 巢狀 nested:
- 第二層 second level
- 有序清單 ordered
- 番号付きリスト numbered
resource "aws_security_group_rule" "api" {
cidr_blocks = ["10.0.0.0/8"] # code block
}| 表格 | 欄位 | 数字 |
|---|---|---|
| row 分隔 hairline | 内容 | 1,024 |
| 最後一列無線 | 内容 | 42 |
npx shadcn@latest add https://washiveil.alexchih.com/r/prose.jsonInstall
Every component pulls the theme token layer automatically.
npx shadcn@latest add https://washiveil.alexchih.com/r/glass-card.json