主流 UIC01
玻璃擬態
Glassmorphism
半透玻璃面、背景模糊（backdrop-filter）與微光暈，呈現空間層次感。
📄 子頁待開
01 / 主流 UI
主流 UI
Mainstream UI · 5 styles
主流 UIC02
新擬物化
Neumorphism
同色系柔陰影與微凸介面，模擬實體物件的觸感與雕塑感。
📄 子頁待開
主流 UIC03
Material You
Material 3
動態色彩、明確層階與圓角元件的系統化設計語彙，當代產品學院派。
📄 子頁待開
主流 UIC04
極簡主義
Minimalism
大量留白、單色字體與精確比例的排版美學，藝廊式靜謐視覺。
📄 子頁待開
主流 UIC05
沉浸暗黑
Immersive Dark
深色基底配低彩度發光點，營造劇場聚光燈式的沉浸氛圍。
📄 子頁待開
02 / 復古懷舊
復古懷舊
Retro Nostalgia · 6 styles
復古懷舊C06
蒸氣波
Vaporwave
紫粉漸層、希臘雕像與日文符號的 1990s 網際網路懷舊美學。
📄 子頁待開
復古懷舊C07
Y2K 千禧
Y2K
銀色金屬、半透塑膠與星型裝飾元素的 2000 年初千禧美學。
📄 子頁待開
復古懷舊C08
90s Web 1.0
Web 1.0
系統字體、tile 平鋪背景與灰色按鈕的早期 1990s 網頁風格。
📄 子頁待開
復古懷舊C09
美式復古印刷
American Retro Print
網點質感、油墨偏色與粗襯線標題的 1970s 印刷海報風。
📄 子頁待開
復古懷舊C10
80s Synthwave
Synthwave
霓虹線條、紫紅落日與透視格線的 1980s 數位美學。
📄 子頁待開
復古懷舊C11
包浩斯
Bauhaus
紅黃藍三原色配圓三角方塊的幾何構成，1920s 德國學院派。
📄 子頁待開
03 / 實驗前衛
實驗前衛
Experimental · 6 styles
實驗前衛C12
野獸派
Brutalism
裸露結構、強烈對比與粗暴排版的反 UX 設計哲學。
📄 子頁待開
實驗前衛C13
故障藝術
Glitch Art
RGB 錯位、掃描線與隨機破碎的數位失真美學。
📄 子頁待開
實驗前衛C14
賽博龐克
Cyberpunk
霓虹粉藍配黑底、片假名與發光邊框的高科技反烏托邦視覺。
📄 進入 C14 demo →
實驗前衛C15
構成主義
Constructivism
紅黑斜切構圖與宣傳海報語法的俄式前衛排版。
📄 子頁待開
實驗前衛C16
ASCII 終端機
ASCII Terminal
綠底螢光字、ASCII art 與 80×24 終端機網格的純文字美學。
📄 子頁待開
實驗前衛C17
雜誌排版
Editorial Magazine
12 欄網格、粗襯線標題與圖文混排的傳統雜誌排版邏輯。
📄 子頁待開
04 / 文化在地
文化在地
Cultural · 5 styles
文化在地C18
日式禪意
Wabi-Sabi
米色紙質、墨筆觸與不完美留白的日式侘寂美學。
📄 子頁待開
文化在地C19
中國風國潮
Chinoiserie / Guochao
硃紅墨黑、宋體字配水墨點綴的中式古典與當代潮流融合。
📄 子頁待開
文化在地C20
北歐極簡
Scandinavian
木質暖灰、無襯線清爽字體與北歐插畫的自然森林感。
📄 子頁待開
文化在地C21
瑞士國際風格
Swiss International
左對齊網格、Helvetica 與紅色強調的二戰後理性排版革命。
📄 子頁待開
文化在地C22
台灣廟會
Taiwan Temple Carnival
霓虹招牌、紅黃對比與民俗符號的台灣在地熱鬧視覺。
📄 子頁待開
05 / 裝飾性
裝飾性
Decorative · 3 styles
裝飾性C23
等距 3D
Isometric 3D
30 度斜角立體插畫、玩具世界與小人物構圖。
📄 子頁待開
裝飾性C24
手繪塗鴉
Hand-Drawn Sketch
蠟筆、歪斜手寫字與隨意箭頭的人工速寫感。
📄 子頁待開
裝飾性C25
漸層 Mesh
Gradient Mesh
流動曲線漸層、極光色彩與柔光球體的液態畫布。
📄 子頁待開
06–10 / 動態效果
動態效果
Motion · 5 sub-clusters · 15 effects
06 ▸ 視差 Parallax
視差C26
多層視差
Parallax Layers
滾動時多層元素以不同速度位移，呈現縱深感。
📄 子頁待開
視差C27
Sticky 堆疊章節
Sticky Stack
章節先被釘住、再被下一章從底部疊上的堆疊滾動模式。
📄 子頁待開
視差C28
橫向滾動陣容
Horizontal Scroll
垂直滾動轉換為內容區段的橫向滑動位移。
📄 子頁待開
07 ▸ 滾動 Scroll
滾動C29
全屏章節切換
Scroll Snap Acts
每個區段佔滿視窗、scroll-snap 強制吸附的章節切換。
📄 子頁待開
滾動C30
滾動進度指示
Scroll Progress
頂部 progress bar 與側邊章節點陣指示當前閱讀位置。
📄 子頁待開
滾動C31
滾動跑馬燈
Marquee Band
大字橫向跑動、速度依滾動而調變的 marquee 效果。
📄 子頁待開
08 ▸ 入場 Entrance
入場C32
錯落淡入
Fade Stagger
卡片進入視窗時依序錯落淡入位移的波浪入場。
📄 子頁待開
入場C33
打字機標題
Typewriter
Hero 標題以打字機節奏一字一字浮現，段落隨之滑入。
📄 子頁待開
入場C34
數字爆裂計數
Counter Burst
數字在滾入視窗時從 0 動畫跳動至目標值。
📄 子頁待開
09 ▸ 循環 Loop
循環C35
極光漸層流動
Aurora Flow
多色 radial-gradient 球體以長 loop 緩慢流動。
📄 子頁待開
循環C36
漂浮幾何球
Floating Orbs
背景幾何形體上下漂浮、速度時快時慢的呼吸感。
📄 子頁待開
循環C37
動態噪點
Noise Grain
動態膠片顆粒疊加緩慢色相旋轉的舊膠卷質感。
📄 子頁待開
10 ▸ 指標 Cursor
指標C38
滑鼠光暈
Cursor Spotlight
光暈隨滑鼠位置移動的局部 radial-gradient 照明。
📄 子頁待開
指標C39
3D 傾斜卡片
Tilt Cards
卡片依滑鼠位置 3D 傾斜的 perspective 觸感互動。
📄 子頁待開
指標C40
磁吸按鈕
Magnetic CTA
按鈕在滑鼠靠近時被輕微吸過去的磁吸物件效果。
📄 子頁待開