Design System Preview · No. 07

Dramatic
Light

戲劇光影 — 一束聚光燈打在近乎全黑的舞台上,光決定一切。
One key light against total darkness. Everything else is void.

Core Palette 01 / COLOR

虛空黑 Void
#0A0A0C
舞台炭黑 Stage
#141416
聚光金 Spotlight
#C9A227
餘燼金 Ember
#8A6C1F
象牙白 Ivory
#F5F1E8
灰燼灰 Ash
#9A958A
炭線灰 Line
#2A2823

Typography 02 / TYPE

H1 — Bebas Neue · clamp(3.5rem, 10vw, 8rem)
Opening Night
H2 — Playfair Display · 2.75rem

第二幕:光與影的交界

H3 — Playfair Display · 1.5rem

一個場景,一束光,一段獨白

Tagline — Playfair Display italic · 1.15rem

In darkness, one light is enough to tell the whole story.

Body — Noto Serif TC · 1.05rem · line-height 1.85

正文使用襯線字型維持劇場節目冊的閱讀質感,連結色為聚光金,hover 會轉為象牙白,技術性標記如 #C9A227 一律用等寬字型呈現。

Buttons 03 / ACTION

Tags & Badges 04 / LABEL

Featured Limited Run Premiere Encore

Cards 05 / SURFACE

ACT I

The Long Shadow

單一光源、極簡道具——用最少的元素撐起最大的戲劇張力。卡片預設幾乎融入背景,直到被打光。

ACT II

The Last Spotlight

Hover 時邊框轉實金並泛出光暈,模擬一束燈光緩緩打在物件上——深度來自光的強弱,不是陰影。

Signature Component 06 / SPOTLIGHT PANEL

"每個場景只留一束光。其餘的,交給黑暗去說。"

Concept Dramatic Light· Palette Spotlight Gold· Type Bebas / Playfair· Year 2026

Color Reference 07 / TABLE

色彩Hex角色
虛空黑 Void#0A0A0CCanvas — 頁面背景
舞台炭黑 Stage#141416大區塊底、header/footer
聚光金 Spotlight#C9A227Primary — 標題、CTA、邊框
餘燼金 Ember#8A6C1FSecondary — hover/pressed
象牙白 Ivory#F5F1E8標題文字
灰燼灰 Ash#9A958A正文文字
炭線灰 Line#2A2823Hairline 邊框、分隔線