厳選・オープン・無料

Ashleyandco

ソフトなニュートラルカラーとフォトグラフィック・ミニマリズムを用い、落ち着いたプレミアムなショッピング体験を創造するモダンな香りの会社。

CalmPhotographicCleanProductPremium
Ashleyandco のスクリーンショット
↓ デザインシステムをダウンロード (26 MB)OpenDesign で開く

オリジナル: https://ashleyandco.co

📦 パックの中身を見る →

01

デザイン DNA

scentmoderncleanrefinedminimal

雰囲気を纏う写真と静かなタイポグラフィに依存する、ハイエンドのミニマリスト・ブティック。

02

カラー

#3C3C3CInk
#F6F3F0BG
#939393Muted
rgba(3C3C3C, 0.1)Line

暖かみのある、彩度の低いニュートラルカラー。退くことでライフスタイル写真を支配させる。

03

タイポグラフィ

transitional-serif · grotesque-sans

ヘッドラインには、クリーンなsans-serif本文テキストに対してエレガントなコントラストを生むserifを使用。 · ナビゲーションとセカンダリテキストは、クリーンでリズミカルなベースラインを維持するため、広めの字間で大文字化。 · 本文テキストは小さく目立たないようにし、ネガティブスペースを最大化。

04

余白

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

コンテナ内の十分なpaddingで、上質で散らからいない雰囲気を維持。

05

サーフェス (角丸 / 影 / 罫線)

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

最小限。ほぼ、ダークインクや控えめなグレーのシンプルな1pxラインで定義。

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

非対称の分割レイアウトとフル幅の雰囲気写真。

07

モーションとインタラクション

220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

落ち着いた閲覧体験のための、滑らかなフェードインと穏やかなeasing。

控えめなopacityの変化やカラーのトランジション。 · 状態変化による即座のビジュアルフィードバック。

08

コンポーネント

09

文体と禁止事項

10

パック内の実スクリーンショット

Ashleyandco — 桌面首屏（hero）
桌面首屏（hero）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Ashleyandco — 移动首屏
移动首屏

実ページから取得 · 実 computed styles

11

System Prompt

This design DNA is for a premium scent company with a calm, minimalist, and photographic approach. It uses a warm neutral palette (#F6F3F0, #3C3C3C, #939393) and a clean typographic hierarchy pairing a transitional-serif display font with a grotesque-sans body font. The layout relies on generous negative space and high-quality lifestyle imagery. Critical donts: avoid vibrant colors, avoid heavy shadows or borders, avoid decorative fonts, avoid rounded UI elements, avoid dense text, and avoid aggressive or promotional language. This style is suitable for premium consumer brands, editorial sites, or high-end product showcases where atmosphere is paramount.

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック（エージェント用） ↗

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