精選 · 開放 · 免費
Pleo
集中管理企業支出與費用的平台
fintechsaas
01
設計氣質 DNA
財務效率企業支出自動化掌控
一套現代化的財務作業系統
02
色彩
#FFFFFFAccent
#000000Ink
#333333Ink soft
#F5F5F5BG soft
#888888Muted
rgba(0, 0, 0, 0.1)Line
高對比度的單色調色板，帶來清晰度與信任感
03
字型
neo-grotesque-sans · monospace
- display
64px · 400 - h2
45px · 400 - body
23px · 400 - caption
16px · 400
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
寬裕的垂直節奏，區塊內邊距為 80px
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 4px
lg · 8px
pill · 159984px
互動元素使用 1px solid rgba(0, 0, 0, 0.1) 邊框
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
置中的單欄主視覺區塊，後接交替的內容區塊
07
動效與互動
130msmicro
230mssmall
400msmedium
cubic-bezier(0.4, 0, 1, 1)easing
hover 時流暢的顏色與背景過渡效果
細微的顏色過渡或背景轉換 · 即時反應，延遲極小
08
組件
- button 膠囊形狀，高對比度（黑色背景/白色文字或白色背景/黑色文字）
- card 帶有圓角的淺色背景區塊
- hero 大尺寸粗體標題，搭配簡潔的輔助文字與雙重 CTA 按鈕
09
文案語氣與禁用清單
- 語氣 直接、賦能且專業
- 標題風格 祈使句式，以效益為導向
- 按鈕文案 清晰且可執行
- 勿使用裝飾性漸層 — 螢幕截圖顯示為平整的純色背景
- 勿在卡片上使用陰影 — 螢幕截圖顯示為帶有細微邊框的平整表面
- 勿使用過重的字體粗細 — 螢幕截圖顯示為一致的 400 字重排印
- 勿使用鮮豔的強調色 — 螢幕截圖顯示為嚴格的單色調色板
- 勿在主視覺區塊中使用複雜的多欄佈局 — 螢幕截圖顯示為置中的單欄主視覺
- 勿使用小圓角的圓角矩形 — 螢幕截圖顯示為完整的膠囊形按鈕
- 避免: 行話
- 避免: 複雜的財務術語
- 避免: 侵略性的銷售用語
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個專注於企業費用管理的高端金融科技 SaaS 平台。設計採用精緻的極簡主義美學，搭配嚴格的單色調色板（黑色、白色與淺灰色），以傳達信任感與效率。字體排印採用乾淨的新怪誕風格無襯線字體，並設有大型、高對比度的主視覺區塊。關鍵 hex 顏色為 #000000、#FFFFFF 與 #F5F5F5。重要的設計限制包括：不使用裝飾性漸層或厚重的陰影、使用一致的 400 字重、以及實施膠囊形按鈕取代標準的圓角矩形。避免使用複雜的多欄主視覺佈局或鮮豔的強調色。
en · zh-CN · zh-TW · ja · ko