精選 · 開放 · 免費
Matteroffact Fr
一個極簡的法國創意工作室作品集，完全依賴大規模字體規模與鮮明的黑白對比。
StudioEditorialPhotographicBold TypographyClean
01
設計氣質 DNA
創意代理商極簡主義字體驅動藝術性直接
一座極簡的畫廊，大規模字體排印是主要展品，互動則簡化為必要的框線觸發器。
02
色彩
#000000Ink
#a0a0a0Ink soft
#ffffffBG
#c0c0c0Muted
rgba(0,0,0,1.0)Line
嚴格的單色調，黑色文字與邊框搭配純白背景，使用灰階建立視覺層級。
03
字型
grotesque-sans
- display
160px · 400 - h1
36px · 400 - body
22px · 400
所有介面與文字元素使用 FreeSans 字族 · 所有文字保持 400 字重 · 內文與副標題行高緊湊設定為 1.2
04
間距
4px
8px
16px
18px
24px
32px
48px
64px
寬鬆的節奏，基於 4px 格線，重點使用 18px 與 45px 的框線元素 padding。
05
表面 (圓角 / 陰影 / 邊線)
sm · 0px
md · 0px
lg · 0px
pill · 0px
實心 3px 黑色邊框，僅用於按鈕與導覽連結等框線化介面元素。
06
版面
1920container
12columns
18pxgutter
768 / 1024breakpoints
不對稱、邊緣對齊的佈局，大型文字區塊推向邊界，導覽以角落定位的框線呈現。
07
動效與互動
200msmicro
250mssmall
1000msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
所有屬性的過渡效果 · opacity 淡入淡出 · 顏色變化
觸發於可點擊的框線元素，可能改變文字顏色或邊框顏色。 · 互動元素使用標準指標游標。
08
組件
- button 裸露的矩形盒，帶有實心 3px 黑色邊框與內部 padding，類似基礎 HTML 表單元素。
- hero 以超大、流動的文字佔據視窗，同時作為導覽元素。
09
文案語氣與禁用清單
- 語氣 直接、不加修飾，略帶對抗性。
- 標題風格 俏皮的大規模字體排印，使用押韻或重複詞彙（Fact, Fake, Tab, Hack）。
- 按鈕文案 裸露、功能化，無視覺華麗感。
- 不要使用圓角——截圖顯示所有按鈕與元素皆為銳利的 0px 矩形角
- 不要套用陰影——截圖顯示完全扁平、無邊框且無高度的介面
- 不要使用彩色背景——截圖顯示嚴格的純 #ffffff 白色背景
- 不要使用具有明顯特徵的裝飾性無襯線字體——截圖顯示統一、中性的 grotesque-sans
- 不要將所有文字置中對齊——截圖顯示積極的左對齊與右對齊字體排印
- 不要使用粗體字重——截圖顯示所有文字嚴格設定為 400 的常規字重
- 避免: 漸層
- 避免: 柔和陰影
- 避免: 圓角
- 避免: 鮮豔強調色
- 避免: 裝飾性圖示
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
Matter of Fact 是一個極簡的法國創意工作室作品集，優先考量原始字體規模而非傳統的介面精緻感。設計基於嚴格的黑白調色盤，使用 #000000 墨色與 #ffffff 背景，搭配中性的 FreeSans 字型並維持恆定的 400 字重。導覽與互動元素簡化為極簡的 3px 實心黑色邊框盒，摒棄所有現代裝飾。重要禁忌：絕不使用圓角（介面完全為銳角邊緣），絕不套用陰影或漸層（美學完全扁平），絕不使用粗體字重（所有文字維持常規）。佈局依賴大規模、不對稱的字體排印引導使用者視線，創造出既原始又高度策展的表達性與刻意未經修飾的感覺。
en · zh-CN · zh-TW · ja · ko