精選 · 開放 · 免費
Guglieri
為設計師與教育者打造的大膽、高對比度個人作品集網站。
PortfolioStudioPremiumBold TypographyRefined
01
設計氣質 DNA
設計師教育者工藝作品集個人
資深設計專業人士的數位作品集
02
色彩
#ffffffInk
#575757Ink soft
#000000BG
#1c1c1cBG soft
#454545Muted
rgba(87, 87, 87, 0.3)Line
高對比單色調，並藉由字型來強化視覺衝擊
03
字型
geometric-sans · humanist-sans
- display
64px · 1000 - h2
32px · 400 - body
14px · 400
標題使用極粗字重 (1000) 並收緊字距 · 內文使用標準字重 (400) 並帶有輕微負字距 · 導覽連結採用全大寫且尺寸較小
04
間距
4px
8px
12px
16px
24px
32px
48px
64px
96px
基於 4px 網格的一致間距節奏
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
用於分隔的細微線條
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
全寬區塊並搭配寬裕的內距
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
互動元素的細微 hover 過渡效果
透過透明度或色彩變化提供視覺回饋 · 立即回應並改變游標樣式
08
組件
- button 帶有箭頭圖示的膠囊形按鈕
- hero 全寬主視覺區，搭配大型 3D 渲染的游標素材
09
文案語氣與禁用清單
- 語氣 專業、自信且專注於工藝
- 標題風格 大膽直接的陳述
- 按鈕文案 清晰且以行動為導向，搭配箭頭指示
- 不要使用淺色背景 — 網站以黑色 (#000000) 為主
- 不要使用輕細字重作為標題 — 設計採用極粗字重 (1000)
- 不要為 UI 元素添加過多陰影或 3D 效果 — 3D 效果僅保留給影像素材
- 不要為內文使用寬鬆的字距 — 網站使用收緊的字距 (-0.28px)
- 不要引入明亮的強調色 — 調色盤嚴格採用單色調，僅透過影像提供色彩
- 不要使用裝飾性字型 — 字型採用簡潔的幾何無襯線體
- 避免: 充滿術語的語言
- 避免: 過於隨意的語氣
- 避免: 過多的驚嘆號
11
System Prompt
這是一個為設計師與教育者 Claudio Guglieri 製作的個人作品集網站。設計高端精緻，聚焦於粗體字型與高對比度。色彩以黑色 (#000000) 與白色 (#ffffff) 為主，並搭配柔和灰色 (#575757) 作為次要文字。字型使用幾何與人文無襯線體類別，顯示文字採用極粗字重 (1000) 與緊湊字距。佈局空間寬裕，專注於視覺衝擊。嚴禁事項：切勿使用淺色背景、避免為標題使用輕細字重，以及不要添加任何會削弱大膽、簡潔美學的不必要裝飾元素。網站透過深色背景上的高品質 3D 影像來展示作品。
把這份品味接進你的 Agent
把這套設計的機器可讀規格——色彩、字體、動效，整套 DNA——直接交給你的 AI Agent。
OpenDesign 技能 ↗en · zh-CN · zh-TW · ja · ko