精選 · 開放 · 免費

Postmark

人們真正喜歡的郵件配送服務。

01

設計氣質 DNA

一個高效、專注的配送服務，優先處理重要郵件而非垃圾信件。

02

色彩

高對比度、充滿活力的主黃色，搭配純淨白色與深墨色，確保可讀性。

03

字型

slab-serif · humanist-sans · monospace

• display56px · 900
• heading40px · 700
• subhead20px · 400
• body16px · 400
• caption14px · 400

使用粗襯線體作為主要醒目標題，傳達友善與力量感。 · 使用人文主義無襯線體作為內文，維持卓越的可讀性與現代感。 · 大型展示文字保持緊湊的字距。

04

間距

8px 網格

05

表面 (圓角 / 陰影 / 邊線)

1px solid rgba(36,39,45,1)

0px 2px 3px 0px rgba(0,0,0,0.07) · 0px 4px 15px 0px rgba(0,0,0,0.07) · 0px 9px 25px 0px rgba(0,0,0,0.2)

06

版面

標準首頁佈局，採分割欄位：左側為內容，右側為視覺元素或推薦卡片。

07

動效與互動

元素進入視窗時淡入並向上滑動。 · 滑動狀態的顏色平滑過渡。

背景色或文字色的細微變化，搭配流暢過渡。 · 透過標準按鈕狀態提供即時回饋。

08

組件

• button 實心主色並帶有圓角，用於主要行動呼籲。
• card 白色背景，帶有細微陰影與圓角，用於推薦內容。
• chip 帶有箭頭指示的簡潔文字連結。
• input 標準文字輸入框，具有清晰邊框與內距。
• hero 在活潑的背景色上，使用大而粗體的排版，搭配輔助視覺元素或行動呼籲。

09

文案語氣與禁用清單

• 語氣 自信、直接且友善。
• 標題風格 大膽、清晰陳述價值主張。
• 按鈕文案 以行動為導向，聚焦於開始試用或瞭解更多。

• 不要使用深色模式主題 — 截圖顯示明亮、充滿活力的黃色作為主要背景。
• 不要使用過於複雜的漸層 — 截圖主要顯示純色背景，透過陰影營造細微深度。
• 不要使用纖細、裝飾性的襯線字體 — 截圖顯示穩固、粗壯的展示字體。
• 不要使用低飽和度、低對比度的配色 — 截圖顯示活潑、高對比度的配色方案。
• 不要使用高度密集、多欄的佈局 — 截圖顯示寬裕的空白與清晰的章節分隔。
• 不要使用通用、抽象的圖標 — 截圖顯示自訂的線條藝術插畫，增添特色。
• 避免: 避免使用可能疏遠非開發者的過度技術術語。
• 避免: 避免冷漠或純粹企業化的語調。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko