精選 · 開放 · 免費

Deepgram

使用最準確且具成本效益的即時 APIs，建構語音轉文字、文字轉語音與語音代理程式。

01

設計氣質 DNA

語音智能的基礎設施層，類似於 Stripe 之於支付。

02

色彩

以深色模式為主導，搭配鮮明的 teal 強調色，以突顯創新與專注於開發者的工具。

03

字型

geometric-sans · humanist-sans · monospace

• display56px · 700
• body-lg18px · 400
• body-sm14px · 400
• mono14px · 400

標題尺寸使用緊湊的字距調整（-1.2px）以增強視覺衝擊力。 · 內文字體保持寬裕的行高（1.55）以確保可讀性。 · 字重嚴格限定為 400、500、600 和 700。 · 標題使用幾何無襯線體，傳達現代技術的精確感。

04

間距

一致的 4px 網格系統，搭配寬裕的垂直間距（32px、48px、64px），用以分隔不同的內容區塊。

05

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

1px solid rgba(44, 44, 51, 1)

0px 24px 48px -12px rgba(38, 44, 52, 0.25) · 6px 0px 15px 0px rgba(56, 237, 172, 0.2) · -6px 0px 15px 0px rgba(20, 154, 251, 0.2)

06

版面

置中的內容結構，搭配清晰的章節分隔。首頁橫幅採用全寬與置中文字，過渡到多欄網格以展示功能與合作夥伴。

07

動效與互動

hover 時平滑的顏色與背景過渡效果（0.15s-0.2s）。 · 互動元素帶有細微的 opacity 與 filter 變化。 · 關鍵詞組使用漸層動畫以視覺化強調。

按鈕與連結在 hover 時有細微的背景色與文字色變化。 · 透過狀態變化（例如按鈕下壓或色彩轉換）提供即時的視覺回饋。

08

組件

• button 主要按鈕為實心白色配深色文字；次要按鈕為透明配鮮明 teal 邊框。兩者均採用藥丸形圓角。
• card 深灰色卡片（#1F1F24），帶有細微邊框、圓角（8-12px），以及一致的內部 padding（32px）。
• chip 藥丸形徽章，用於分類或功能標示，啟用狀態採用 teal 強調色。
• input 深色輸入欄位，帶有細微邊框與淺色文字，符合深色主題美學。
• hero 大型置中標題，採用鮮明 teal 漸層文字（「Powered by Deepgram」），後接描述性文字與兩個醒目的行動號召按鈕。

09

文案語氣與禁用清單

• 語氣 自信、具技術性且著眼未來。
• 標題風格 大膽、宣言式的語句，強調市場領導地位與技術優越性。
• 按鈕文案 直接且以行動為導向（「免費註冊」、「開始建構」、「Playground」）。

• 避免使用淺色或粉彩色背景——截圖顯示其主要畫布為深沉的深色主題（#0F0F13）。
• 避免在所有元素上套用漸層——截圖僅在主要標題文字上謹慎使用鮮明的 teal 漸層。
• 避免使用小而擁擠的排版——截圖採用大型、粗體的標題尺寸（56px+）搭配寬裕的行高。
• 避免在所有元素上使用圓角——截圖中的卡片與按鈕採用銳角或輕微圓角（4-12px），僅有藥丸形徽章為完全圓形。
• 避免使用多色調色盤——截圖以深色調、白色文字及單一鮮明 teal 強調色為主。
• 避免隱藏主要操作——截圖在首頁橫幅區域醒目地展示「免費註冊」與「Playground」作為大型、高對比度的行動號召按鈕。
• 避免: 過於隨意或俏皮的語言。
• 避免: 缺乏明確脈絡的過度行話。
• 避免: 被動或猶豫不決的措辭。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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