Cosmic Dark Mode UI 設計系統

生成一套包含配色方案、排版與太空主題組件的全面性 Dark Mode UI 設計系統。

提示詞

{ "type": "UI 設計系統", "theme": "dark mode, 太空靈感, 發光裝飾", "header": { "label": "設計系統", "title": "COSMIC GRAVITY", "subtitle": "A Design Language Inspired by the Universe." }, "layout": { "left_column": [ { "title": "色彩", "count": 7, "items": [ {"name": "Cosmic Black", "hex": "#050507"}, {"name": "Deep Space", "hex": "#0E0F14"}, {"name": "Soft White", "hex": "#F5F6F8"}, {"name": "Stardust Gold", "hex": "#F5D28A"}, {"name": "Night Purple", "hex": "#1A1C2A"}, {"name": "Dusk Blue", "hex": "#0F1B2A"}, {"name": "Nebula Teal", "hex": "#0E1F22"} ] }, { "title": "漸層", "count": 1, "description": "呈現由暗到亮再到暗的宇宙光暈水平條" }, { "title": "排版", "font": "Space Grotesk", "hierarchy_count": 4, "levels": ["H1 Cosmic Light", "H2 Explore More", "Body Celestial Text", "Caption Orbit Info"] } ], "main_column": [ { "title": "UI 組件", "subsections": [ {"title": "按鈕", "count": 3, "labels": ["探索 (主要)", "取消 (次要)", "更多 (幽靈按鈕)"]}, {"title": "滑桿", "count": 1, "value": "72%"}, {"title": "開關", "count": 2, "states": ["關", "開"]}, {"title": "標籤", "count": 3, "labels": ["黑洞", "木星", "軌道"]} ] }, { "title": "卡片", "count": 3, "items": [ {"title": "JUPITER", "subtitle": "軌道檔案", "image": "木星"}, {"title": "黑洞", "subtitle": "宇宙事件", "image": "帶有吸積盤的黑洞"}, {"title": "距離", "value": "778.3 M km", "image": "同心軌道環"} ] }, { "title": "數據顯示", "count": 3, "items": [ {"title": "能量", "type": "圓形進度環", "value": "87%"}, {"title": "訊號強度", "type": "帶有發光節點的折線圖", "value": "42.6 dB"}, {"title": "宇宙雜訊", "type": "音訊播放器 UI"} ] }, { "title": "圖示", "count": 7, "labels": ["首頁", "行星", "閃耀", "訊號", "資料夾", "愛心", "使用者"] } ], "bottom_row": [ { "title": "視覺元素", "count": 5, "labels": ["黑洞", "重力環", "光暈", "星雲塵埃", "玻璃表面"] } ] } }