精選 · 開放 · 免費

Turso

AI 代理時代的資料庫。

01

設計氣質 DNA

一款精確工程化的開發者工具，兼具現代金融科技儀表板的美感。

02

色彩

以深色模式為基底，搭配高對比的霓虹點綴色，用於關鍵的行動呼籲。

03

字型

geometric-sans · ui-monospace

• display64px · 800
• body16px · 400

所有介面與內文皆使用 Inter（幾何無襯線字體）。 · 大型顯示標題保持緊湊的負字間距。 · 所有介面元素使用簡潔、高度易讀的幾何無襯線字體。

04

間距

一致的 4px 基礎比例，提供清晰、寬裕的內邊距與間距。

05

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

1px solid rgba(255,255,255,0.1)

06

版面

全寬的深色區塊，搭配置中且受限制的內容區塊。

07

動效與互動

在 hover 狀態下，流暢的顏色與背景色過渡。 · 互動元素帶有細微的透明度變化。

流暢的 background-color 與 text-color 過渡，持續 150-200 毫秒。 · 立即的視覺回饋，透過降低透明度或顏色變換實現。

08

組件

• button 高對比的膠囊狀按鈕，使用霓虹色背景與深色文字。
• card 帶有細微邊框的卡片，採用深色背景與柔和的圓角。
• chip 小型的膠囊狀標籤，背景色調較為柔和。
• input 簡潔的輸入欄位，帶有細微邊框與深色背景。
• hero 以大量文字為主體的巨大置中主視覺，並突出使用霓虹點綴元素。

09

文案語氣與禁用清單

• 語氣 權威、技術性且具前瞻性。
• 標題風格 簡短、有力且高度描述性的技術性陳述。
• 按鈕文案 直接、以行動為導向的指令，並以霓虹色強調。

• 不要使用白色背景 — 示範圖顯示深色（#0D1318）基底。
• 不要使用裝飾性襯線字體 — 示範圖顯示簡潔的幾何無襯線字體。
• 不要使用多種點綴色 — 示範圖顯示霓虹薄荷綠（#4FF7D1）是唯一主要的高彩度點綴色。
• 不要使用柔和的陰影 — 示範圖顯示細微的 1px 邊框與背景色變換來營造層次感。
• 不要使用狹窄擁擠的間距 — 示範圖顯示內容區塊周圍有充足的內邊距（例如：40px、128px）。
• 不要將所有標題改為小寫 — 示範圖顯示技術性陳述使用標準標題式大小寫或句式大小寫。
• 避免: 避免使用非正式或隨意的語言。
• 避免: 避免使用缺乏技術實質的通用行銷術語。
• 避免: 避免使用過於複雜或華麗的句子。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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