精選 · 開放 · 免費
Brex
結合卡片、銀行服務與 AI 驅動的費用管理，達企業等級的金融軟體。
fintechsaas
01
設計氣質 DNA
企業金融現代銀行速度控制AI 自動化
為現代企業打造的高效能金融作業系統。
02
色彩
#FF5900Accent
#15191EInk
#FFFFFFBG
#F3F3F7BG soft
#8B8D98Muted
rgba(21, 25, 30, 0.1)Line
以高對比基礎色搭配單一強勢的強調色，以驅動轉換行動。
03
字型
grotesque-sans · humanist-sans · monospace
- display
48px · 400 - heading
36px · 400 - body
16px · 400
展示文字採用緊湊的負字距，以營造高級感 · 統一使用字重 400，確保所有尺寸下的最大可讀性 · 內文使用寬裕的行高，以提升掃讀體驗
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
採用一致的 4px 網格，並搭配寬裕的留白內邊距（水平容器 72px），以維持整潔的對齊。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
結構性元件採用簡約的 1px 實線邊框，顏色為深中性色（#15191E）。
0px 1px 0px 0px rgba(66, 87, 138, 0.15) · 0px 1px 1px 0px rgba(0, 0, 0, 0.04)
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
單欄主視覺區塊，引導至文字與插圖交替排列的功能展示行。
07
動效與互動
125msmicro
200mssmall
500msmedium
cubic-bezier(0, 0, 0.38, 0.9)easing
狀態變化採用細微的線性過渡效果 · 複雜的視覺轉換採用標準的 ease-in-out
互動元件在 hover 狀態時有細微的透明度或色彩變化。 · 點擊時立即產生狀態變化，動畫延遲最小化。
08
組件
- button 主要操作採用實心強調色填滿，次要導覽則使用透明或文字樣式。
- card 採用柔和灰色（#F3F3F7）背景與圓角（12px），用於強調功能特色。
- chip 用於整合夥伴的標準化標籤樣式。
- input 採用簡潔邊框、圓角的輸入欄位，並整合主要 CTA 按鈕。
- hero 大型展示字體搭配高畫質 3D 產品渲染圖，置於中性色背景上。
09
文案語氣與禁用清單
- 語氣 具權威性、高效率且高度專業。
- 標題風格 直接、以利益為導向的陳述，強調速度與規模。
- 按鈕文案 以行動為導向且簡潔（例如：「立即開始」、「觀看示範」）。
- 請勿使用溫暖或俏皮的色盤——截圖顯示其採用嚴格的黑/白/橙配色方案。
- 請勿在 UI 卡片上套用過多的陰影或 3D 效果——截圖顯示其採用平面、簡潔的表面。
- 請勿使用裝飾性或襯線字體作為展示文字——截圖使用簡潔、緊湊的無襯線字體。
- 請勿在版面中混雜多個互相競爭的強調色——截圖僅使用橙色作為單一的亮點。
- 請勿對重要資訊使用低對比度文字——截圖以深色墨水色維持高辨識度。
- 請勿在標題中使用鬆散、過寬的字距——截圖使用緊湊的字距（-0.96px）以增強衝擊力。
- 避免: 俏皮或過於隨意的語言
- 避免: 不必要的術語或複雜的金融專業術語
- 避免: 被動語態或弱動詞
- 避免: 缺乏具體價值主張的模糊承諾
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一套為 Brex 設計的高端金融科技 SaaS 介面，特徵包括乾淨的白色（#FFFFFF）背景、深色中性墨水色（#15191E），以及用於轉換點的單一強勢橙色強調色（#FF5900）。字體排印上，展示標題採用簡潔、緊湊的 grotesque-sans（尺寸 48，字重 400，ls -0.96px），內文則採用高可讀性的 humanist-sans。版面遵循嚴格的 12 欄網格，欄間距 24px，水平內邊距 72px，並強調寬裕的留白與高畫質 3D 產品渲染圖。關鍵的設計限制包括避免俏皮的語調、維持單一強調色策略，以及在所有展示文字上使用緊湊的字距，以傳達速度與精準感。
en · zh-CN · zh-TW · ja · ko