精選 · 開放 · 免費
Glow
一個潔淨、現代的 Solana 錢包登陸頁面,重點在於行動裝置與瀏覽器擴充功能的可用性
FintechMobile UICleanProductCalm
01
設計氣質 DNA
Solana錢包現代化無障礙加密貨幣
一款感覺像高階消費性產品的友善金融科技應用程式
02
色彩
#CC62D5Accent
#131517Ink
#737577Ink soft
#FFFFFFBG
#F4F5F6BG soft
#B3B5B7Muted
rgba(179, 181, 183, 0.3)Line
以潔淨的白色背景搭配中性灰色,並使用鮮明的紫色強調色作為主要操作的引導
03
字型
grotesque-sans
- display
48px · 700 - h1
40px · 600 - body
16px · 400 - caption
12px · 500
04
間距
4px
8px
12px
16px
24px
32px
48px
64px
96px
以 4px 為基礎網格,並搭配寬裕的 padding 以創造舒適的留白空間
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 18px
pill · 100px
1px solid rgba(179, 181, 183, 0.3)
0 4px 24px rgba(0, 0, 0, 0.08) · 0 2px 8px rgba(0, 0, 0, 0.04)
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
雙欄式主視覺區域,左側為文字內容,右側為裝置示意圖
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
在滑鼠懸停與點擊互動時提供流暢的轉場效果 · 頁面元素加入細微的進場動畫
互動元素在滑鼠懸停時有細微的縮放或顏色變化 · 點擊時提供即時的視覺回饋,並帶有輕微的變形效果
08
組件
- button 採用圓角膠囊造型,主要操作按鈕使用實心紫色背景
- card 潔淨的卡片設計,帶有細微陰影與圓角,用於功能區塊
- chip 小型圓角徽章,用於通知提示,如「NEW」
- hero 大型標題搭配副標題與 CTA 按鈕,並附有裝置示意圖
09
文案語氣與禁用清單
- 語氣 友善、自信且現代
- 標題風格 大膽、直接的陳述,與使用者對話
- 按鈕文案 以行動為導向,並清晰傳達價值主張
- 不要使用深色背景 — 螢幕截圖顯示為白色與淺灰色背景
- 不要使用襯線字體 — 螢幕截圖顯示為幾何無襯線字體排印
- 不要使用小圓角的卡片 — 螢幕截圖顯示為大圓角(18px)
- 不要使用柔和的色彩配置 — 螢幕截圖顯示為鮮明的紫色強調色
- 不要使用密集的文字佈局 — 螢幕截圖顯示為寬裕的間距與留白空間
- 不要使用複雜的漸層 — 螢幕截圖顯示主要為實心色彩搭配細微陰影
- 避免: 複雜的技術術語
- 避免: 過於正式的語言
- 避免: 侵略性的銷售手法
10
包內真實截圖
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個潔淨、現代的 Solana 加密貨幣錢包金融科技登陸頁面。它將自己定位為高階消費性產品,採用友善且無障礙的設計。關鍵色彩包括純白(#FFFFFF)背景、深墨色(#131517)、中性灰色(#737577, #B3B5B7),以及鮮明的紫色強調色(#CC62D5)。字體排印採用幾何無襯線字族,標題為粗體、緊湊的字間距,內文則保持潔淨。關鍵設計原則:避免深色模式、維持寬裕的留白空間、在卡片與元件上使用大圓角(18px)、保持介面簡潔不雜亂,並確保紫色強調色在中性背景中顯得突出。佈局在桌面版採用雙欄式,左側為文字內容,右側為裝置示意圖,以創造視覺平衡並在情境中展示產品。
en · zh-CN · zh-TW · ja · ko