精選 · 開放 · 免費

Vacation Inc

靈感源自復古風格的防曬品牌,具備俏皮的 1980 年代泳池畔美學。

ProductConsumerPhotographicPlayfulWarm
Vacation Inc 網站截圖
↓ 下載設計系統包 (24 MB)在 OpenDesign 中開啟

原站: https://www.vacation.inc

📦 瀏覽包內檔案 →

01

設計氣質 DNA

復古俏皮防曬泳池畔懷舊

一本復古的度假手冊,在網頁上躍然呈現。

02

色彩

#333333Ink
#ebe6dcBG
#d8d4cbMuted
rgba(51,51,51,1.0)Line

溫暖的米白色背景搭配深灰色文字,確保高可讀性。

03

字型

transitional-serif · humanist-sans

大型促銷與展示文字使用過渡襯線體。 · 內文與導覽使用人文無襯線體。 · 展示型文字保持負字距。

04

間距

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

基於 4px 格線的統一間距,主要區塊間使用較大間距。

05

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

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

4px solid #333333

rgba(0, 0, 0, 0.1) 1px 1px 5px 0px · rgba(0, 0, 0, 0.75) 2px 2px 2px 0px

06

版面

1280container
12columns
24pxgutter
768 / 1024breakpoints

不對稱格線,搭配重疊影像與寬裕的留白。

07

動效與互動

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

互動元素上的顏色與變形平滑過渡。

細微的色彩變化或影像縮放。 · 標準指標游標。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

設計一個俏皮、復古風格的防曬品牌消費者網站。美學基調為懷舊的 1980 年代泳池畔奢華感,使用溫潤的米白色背景(#ebe6dc)與深灰色文字(#333333)。字體結合了展示文字用的細體過渡襯線體,與內文用的人文無襯線體。主要操作按鈕為全寬、藥丸造型,並填充溫潤的柔和黃色。佈局寬敞且不對稱,常融入復古攝影與復古圖形元素(如條碼或虛線邊框)。避免使用現代極簡主義、純白背景或高對比的霓虹強調色。整體感覺是精緻而奇趣。

把這份品味接進你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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