精選 · 開放 · 免費

Ayakaito

一個精緻的編輯式作品集，透過豐富的攝影靜物展現高端品牌識別與字體排印。

EditorialPortfolioTypographyPhotographicCuration

Ayakaito 網站截圖

↓ 下載設計系統包 (39 MB)在 OpenDesign 中開啟

原站: https://ayakaito.com

📦 瀏覽包內檔案 →

01

設計氣質 DNA

editorialrefinedcuratedJapanesetypography

一間展示攝影、印刷品與字體精緻組合的高端設計工作室廊廳。

02

色彩

#35472CInk

#FEFDF8BG

#35477CMuted

rgba(53, 71, 44, 1)Line

以深橄欖綠與溫潤中性色為主的有機大地色調調色盤。

03

字型

transitional-serif · humanist-sans · monospaced

display62px · 400
body18px · 400

導覽連結使用 18px 的人文主義無襯線體。 · 專案描述使用精緻的過渡襯線體。 · 圖說與元數據通常使用大寫無襯線體。

04

間距

4px

8px

16px

24px

32px

48px

64px

96px

寬裕大方，採用大型字體比例並刻意運用負空間

05

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

sm · 4px

md · 8px

lg · 12px

pill · 999px

互動元素採用 1px 細實深橄欖綠（#35472C）邊框

06

版面

1440container

12columns

24pxgutter

768 / 1024breakpoints

沉浸式全出血攝影圖像搭配分割畫面編輯式佈局。

07

動效與互動

220msmicro

400mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

所有互動元件皆採用平滑過渡（均為 0.3 秒）。 · 懸停狀態下帶有細膩的透明度漸隱效果。

導覽連結與按鈕在懸停時產生細微色彩與透明度變化。 · 連結與專案採用標準指標互動。

08

組件

button 帶有細邊框與圓角膠囊造型的極簡文字連結。
card 分割面板佈局，將大型文字區塊與全出血專案攝影圖像並列呈現。
chip 用於專案分類的小型大寫標籤。
input 無可見元件。
hero 全螢幕沉浸式攝影靜物，覆蓋主要導覽介面。

09

文案語氣與禁用清單

語氣精緻、典雅而靜謐。
標題風格 採用間距緊湊的大型襯線字體，以創造最強的編輯衝擊力。
按鈕文案 低調的膠囊造型外框按鈕，搭配極簡的大寫文字。

勿使用明亮的霓虹強調色——截圖顯示的是柔和的大地色調調色盤。
勿在元件上使用厚重陰影——截圖顯示的是平面的、攝影般的景深效果。
勿使用緊密擁擠的網格——截圖顯示的是寬敞、能呼吸的佈局。
勿使用活潑、圓潤的介面元件——截圖顯示的是精緻的膠囊造型按鈕。
勿使用粗重、醒目的無襯線展示字體——截圖顯示的是優雅、高對比的襯線體。
勿使用剛硬的卡片式佈局——截圖顯示的是沉浸式的全出血編輯式版面。
避免: 明亮飽和的強調色
避免: 厚重陰影
避免: 密集擁擠的網格
避免: 活潑或隨意的語氣
避免: 剛硬的幾何介面元件
避免: 喧鬧的裝飾性背景

10

包內真實截圖

Ayakaito — 桌面首屏（hero） — 桌面首屏（hero）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Ayakaito — 移动首屏 — 移动首屏

擷取自真實頁面 · 真 computed styles

11

System Prompt

這是一個為高端設計工作室打造的精緻編輯式作品集，聚焦於品牌識別、字體排印與插畫。核心色彩主要依賴深橄欖綠（#35472C）與溫潤米白（#FEFDF8），偶爾使用柔和粉色作為區域背景。字體搭配上，大型標題採用優雅的過渡襯線體，導覽與元數據則使用人文主義無襯線體。它優先採用沉浸式全出血攝影與寬裕的留白，而非密集的介面設計。關鍵禁忌：避免霓虹強調色、避免厚重陰影、避免剛硬的卡片式佈局。系統必須維持優雅、靜謐且如同美術館般的視覺層級。

把這份品味接進你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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