精選 · 開放 · 免費

Granola

專為行程滿檔的會議人士設計的 AI 記事本。

01

設計氣質 DNA

一位平靜、聰慧的助理，默默地為你整理一天。

02

色彩

大地色系、自然中性色調，搭配一種獨特的柔和橄欖綠點綴。

03

字型

transitional-serif · geometric-sans

• display56px · 400
• h236px · 400
• body16px · 400

標題字體使用過渡襯線體，營造平靜的編輯感。 · 內文字體使用清晰的幾何無襯線體，確保可讀性。 · 大標題使用緊湊的字距，呈現現代、自信的樣貌。 · 字重使用克制，主要採用 400。

04

間距

寬裕的留白，並基於 4px 建立清晰的垂直節奏。

05

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

1px solid rgba(227, 227, 227, 1)

rgba(0, 0, 0, 0.03) 0px 0px 2px 0px inset · rgba(0, 0, 0, 0.03) 0px 0px 36px 0px · rgba(0, 0, 0, 0.15) 0px 8px 48px 0px

06

版面

居中、單欄的內容流動，搭配寬裕的內距。

07

動效與互動

互動元素的平滑顏色轉場。 · hover 時的背景色與文字顏色轉場。 · 焦點狀態的陰影轉場。

按鈕與連結的細微色彩變化。 · 平滑過渡至按下狀態。

08

組件

• button 藥丸形的主要按鈕，具有高對比度。
• card 邊角柔和圓潤的卡片，帶有細微陰影與淺色邊框。
• chip 藥丸形的標籤，用於功能或標示。
• input 乾淨、極簡的輸入欄位。
• hero 大型、居中的襯線體大標題，搭配一個清晰的行動呼籲。

09

文案語氣與禁用清單

• 語氣 實用、直接，並帶有一絲趣味。
• 標題風格 直接且以效益為導向，使用大型襯線字體。
• 按鈕文案 行動導向、清晰、高對比度。

• 不要使用高飽和度的霓虹色 — 螢幕截圖顯示的是柔和、帶有大地氣息的綠色與溫潤灰色。
• 不要使用粗重、醒目的展示型字體 — 螢幕截圖顯示的是優雅、細至常規字重的襯線體大標題。
• 不要建立雜亂、擁擠的版面 — 螢幕截圖顯示的是寬裕的留白與乾淨、居中的流動。
• 不要使用銳利、方正的邊角 — 螢幕截圖顯示的是柔和、圓潤的邊角（8px, 12px, 藥丸形）。
• 不要使用深色模式或厚重的深色背景 — 螢幕截圖顯示的是淺色、溫潤的米白色（#FBFBF6）主題。
• 不要使用複雜、嘈雜的漸層 — 螢幕截圖顯示的是乾淨、實色的區塊與細微的陰影。
• 避免: 使用過於技術性的行話。
• 避免: 語氣強硬或具侵略性。
• 避免: 使用複雜、多行的標題。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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