精選 · 開放 · 免費

ToyFight

一個結合復古遊戲美學、既俏皮又高端的創意代理商網站。

studiocreative
ToyFight 網站截圖
↓ 下載設計系統包 (6 MB)在 OpenDesign 中開啟

原站: https://toyfight.co

📦 瀏覽包內檔案 →

01

設計氣質 DNA

俏皮復古未來工作室創意原創

一家融合了 8 位元遊戲情懷與高端創意服務的設計工作室。

02

色彩

#0D0D0EInk
#FAF6EFInk soft
#F1E7E7BG
#E9E3F3BG quiet
rgba(13,13,14,1)Line

溫暖、柔和的中性背景色與高對比度的深色墨色形成對比。

03

字型

monospaced · condensed-sans

主要標題使用等寬字體以強化復古科技美學。 · 內文與 UI 文字使用窄體無襯線字體。 · 小型標籤使用大寫字母並增加字距。

04

間距

4px
8px
16px
24px
32px
48px
64px
96px

充足的留白,讓粗獷的字體和 3D 元素得以呼吸。

05

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

sm · 2px
md · 4px
lg · 16px
pill · 999px

1px solid #0D0D0E

0 4px 12px rgba(0,0,0,0.05)

06

版面

1280container
12columns
24pxgutter
768 / 1024breakpoints

不對稱、散落的佈局,包含重疊元素與充足的內距。

07

動效與互動

220msmicro
400mssmall
800msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

色彩與背景變化的流暢轉場。 · 3D 物體的複雜變換動畫。 · 滾動觸發的入場動畫。

互動元素上的細微顏色變化與變換。 · 透過啟用狀態提供即時視覺回饋。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

這是一個結合復古遊戲情懷與高端設計服務的創意代理商網站。色盤以溫暖、柔和的中性色(#F1E7E7、#FAF6EF)為主,對比深墨色(#0D0D0E)。字體方面,展示標題使用等寬字體,內文使用窄體無襯線字體,營造出獨特的復古科技感。佈局不對稱且俏皮,包含散落的字體區塊、3D 互動元素與充足的留白。關鍵限制:永遠不要在展示文字中使用通用的無襯線字體;務必採用散落、重疊的佈局而非僵硬的網格;保持溫暖、柔和的配色,避免冰冷、臨床感的色調。設計在俏皮感與高端工藝之間取得了平衡。

把這份品味接進你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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