精選 · 開放 · 免費

Wearemotto

一個由排版主導、大膽的代理商網站,透過巨型展示字體與廣闊留白來掌控目光。

AgencyBold TypographyCleanPremiumCase Study
Wearemotto 網站截圖
↓ 下載設計系統包 (16 MB)在 OpenDesign 中開啟

原站: https://wearemotto.com

📦 瀏覽包內檔案 →

01

設計氣質 DNA

策略設計諮詢創新未來主義

專注於品牌策略的高端建築事務所

02

色彩

#1B1B1CInk
#717476Ink soft
#F4F3F0BG
#848484Muted
rgba(0, 0, 0, 1)Line

高對比單色調,以溫潤的中性色為基底

03

字型

geometric-sans · humanist-sans

巨型、全大寫的展示字體主導整個佈局 · 大型展示文字採用緊湊的行高(1.0) · 所有文字統一使用中等字重(500)

04

間距

4px
8px
16px
19px
24px
32px
38px
48px
67px
77px
99px
158px

寬裕的垂直間距,主要區塊頂部內距為 158px

05

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

sm · 0px
md · 9px
lg · 9999px
pill · 9999px

1px solid black 用於作用中 CTA 的下底線

06

版面

1440container
12columns
23pxgutter
768 / 1024breakpoints

全出血首頁橫幅,搭配寬幅多欄格線系統用於作品集項目

07

動效與互動

350msmicro
400mssmall
750msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

平滑、高輸出的緩動效果用於內容揭示 · 懸停時細微的透明度過渡 · 作品集元素的複雜變換動畫

連結與按鈕上的細微色彩或透明度變化 · 立即回應,並平滑緩動進入新狀態

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

這是一個高端代理商與諮詢網站,其特色在於巨型、大膽的展示排版與廣闊留白。主要色彩為溫潤的米白色背景(#F4F3F0)與深黑色文字(#1B1B1C),營造出精緻、高對比的美學。排版使用幾何與人文無襯線字類,展示標題採用極端尺寸(150px+),搭配緊湊的 1.0 行高與中等字重。互動效果平滑且精煉,仰賴細微的透明度與色彩變化。關鍵要求:勿使用圓角、陰影或鮮豔強調色;設計純粹依賴排版尺度與空間節奏。避免雜亂的佈局,並確保所有標題保持左對齊與大寫,以實現最大影響力。

把這份品味接進你的 Agent

把這套設計的機器可讀規格——色彩、字體、動效,整套 DNA——直接交給你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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