精選 · 開放 · 免費

Studiofew

一個極簡、優質的字型鑄字所網站，展示字體樣本，搭配鮮明的單色攝影與精緻的使用者介面。

01

設計氣質 DNA

一本以數位形式呈現的高端字型鑄字所樣本書

02

色彩

嚴格的單色調色板，依賴強烈的黑白對比，並以中性灰色建立層次與使用者介面元素。

03

字型

humanist-serif · humanist-sans · geometric-sans

• display158px · 400
• sub-display115px · 400
• body14px · 400
• caption12px · 400

標籤與導覽使用全大寫 · 大型展示字型使用緊湊的字距 · 小型大寫字母的使用者介面使用寬鬆的字距

04

間距

嚴格的 4px 格線，字體樣本區塊周圍留有寬裕的內距

05

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

1px solid black，區塊分隔使用虛線

06

版面

全寬的樣本卡片，以虛線分隔，並設有固定導覽

07

動效與互動

互動狀態的標準透明度過渡效果 · 字體屬性的平滑滑桿調整

細微的透明度降低或游標變化 · 標準按鈕點擊效果，無複雜回饋

08

組件

• button 簡約的直角矩形按鈕，填充黑色或僅描邊，文字為大寫
• card 全寬區塊，用於展示單一字體樣本
• chip 小型圓形圖示與徽章，用於顯示購物車數量
• input 滑桿控制項，搭配簡約的圓點指示器
• hero 大型攝影或 3D 渲染影像，疊加超大樣本排版文字

09

文案語氣與禁用清單

• 語氣 權威、極簡、專注於設計
• 標題風格 超大、緊湊字距、全大寫或大型樣本展示
• 按鈕文案 直接、大寫、高對比按鈕，例如「試用」與「查看」

• 不要使用鮮豔色彩——截圖顯示嚴格的單色黑白灰色調
• 不要為主要按鈕套用圓角——截圖顯示銳利的矩形按鈕
• 不要為大型展示文字使用寬鬆字距——截圖顯示樣本標題使用緊湊字距
• 不要隱藏在活潑的語言背後——截圖顯示直接、功能性的使用者介面標籤，如「大小」與「字重」
• 不要使用厚重陰影或景深——截圖顯示平坦、乾淨的表面
• 不要將所有內容置中對齊——截圖顯示強烈的左對齊排版與使用者介面元素
• 避免: 裝飾性元素
• 避免: 鮮豔色彩
• 避免: 活潑的語言
• 避免: 主要按鈕使用圓角

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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