精選 · 開放 · 免費

Cargo

一個極簡的網站建構工具,將排版與創意作品置於平台裝飾之上。

designportfoliotool
Cargo 網站截圖
↓ 下載設計系統包 (5 MB)在 OpenDesign 中開啟

原站: https://cargo.site

📦 瀏覽包內檔案 →

01

設計氣質 DNA

創意作品集建構工具極簡

一個藝廊級數的數位畫布,專為創意人士打造

02

色彩

#3F3F3FInk
#000000Ink soft
#FFFFFFBG
#FCFCFCBG soft
#D9D9D9Muted
rgba(0,0,0,0.75)Line

嚴格單色與中性,使用高對比的白色背景,確保使用者繽紛的創意作品始終是唯一的焦點。

03

字型

humanist-sans

在展示型尺寸上使用緊湊字距,營造精緻、定制字型的感覺 · 互動元素專用中等字重(500),以提供明確的可操作性提示

04

間距

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

由明確的網格定位驅動的不對稱佈局,而非線性的垂直節奏。

05

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

sm · 0px
md · 4px
lg · 8px
pill · 999px

英雄區中無可見邊框;完全依賴間距與排版來進行區隔。

06

版面

1280container
12columns
24pxgutter
768 / 1024breakpoints

桌面版採用不對稱分割網格,左側放置品牌標識,右側放置操作按鈕。

07

動效與互動

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

懸停狀態時的即時過渡 · 錯落的頁面進入動畫

游標變為指針,文字連結無可見的背景變化。 · 即時狀態改變,無可感知的延遲。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

Cargo 是一個為設計師打造的頂級作品集網站建構工具,採用純淨白色背景與近乎黑色的人文主義無襯線字體,確保創意作品成為焦點。桌面版英雄區採用精緻的不對稱分割網格佈局,搭配巨大且字距緊湊的標題。主要操作由中等字重的文字連結驅動,次要流程則使用實心反白按鈕(亮藍色)。關鍵限制包括:所有容器避免使用 border-radius、不使用投影以維持平面深度感、所有排版維持嚴格的左對齊。設計語言必須保持簡潔、幾何感,並嚴格單色。

把這份品味接進你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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