design system preview

AMBUSH

ambushdesign.com から抽出したデザイントークンのカタログ。Replica + ヒラギノ角ゴシック ProN、12px 統一の極小タイポグラフィ、モノクローム + レッドアクセント。computed style 実測値に基づく。

Shop Now DESIGN.md

01 / colors

Color Palette

brand
Black
#000000
ブランド主軸色
AMBUSH Red
#FF3A32
--ambushRed
text
Text Primary
#000000
本文テキスト
AMBUSH Gray
#808080
補足テキスト
Medium Grey
#666666
メタ情報・価格
surface
Background
#ffffff
ページ背景
Off-White
#fafafa
--color-white
Light Gray
#f5f5f5
--ambushLightGray
Lightest Grey
#f2f2f2
入力フィールド
Light Grey
#e2e2e2
ディバイダー
Accent
#d4d4d4
--color-accent
Grey
#cccccc
ボーダー
Border Default
#a5a5a5
VIEW ALL 枠線
semantic
Error
#990000
--color-error
Error Area
#ECCACB
エラー領域背景

02 / typography

Typography

AMBUSH
Replica / 27.5px / 400 / line-height: 1.3 / letter-spacing: 0.02emLogo
New Arrivals
Replica / 12px / 400 / line-height: 1.3 / uppercaseSection Title
AMBUSH is a Tokyo-based label created by VERBAL and YOON. ジュエリー、アパレル、アクセサリーを展開するラグジュアリーブランド。アヴァンギャルドな精神と日本のクラフトマンシップを融合させたデザインが特徴。
Replica + hiragino-kaku-gothic-pron / 12px / 400 / line-height: 1.3Body
Customer Service
Replica / 12px / 400 / line-height: 0.8 (--lineHeightRate)Footer Heading
配送・返品について
Replica + hiragino-kaku-gothic-pron / 12px / 400 / color: #808080Footer Link

03 / article

Article Sample

Ambush Spring/Summer 2026 Collection

VERBAL と YOON が手がける AMBUSH の 2026 年春夏コレクション。東京のストリートカルチャーとハイジュエリーの伝統を融合させた新しい表現を探求する。チェーンモチーフ、ボリュームのあるシルエット、モノクロームを基調としたパレットが特徴的なシーズン。

素材にはスターリングシルバー、18K ゴールド、レザーを採用。すべてのピースは東京のアトリエで職人の手により仕上げられている。

2026.06.01 - Collection

04 / products

Product Cards

View All

05 / buttons

Buttons

Add to Bag
Primary (5px radius)
Continue Shopping
Secondary (5px radius)
View All
Tertiary (0 radius)
Sign Up
Newsletter (5px radius)
accent state
Sale
AMBUSH Red accent

06 / cards

Cards

Editorial Image
Spring/Summer 2026
View Collection
Campaign Image
Collaboration
AMBUSH x Nike
Lookbook Image
Lookbook
Fall/Winter 2025

07 / forms

Forms

Default -- border 1px solid #cccccc / radius 0
Focus -- border 1px solid #000000
Please enter a valid email address
Error -- border 1px solid #990000

08 / elevation

Depth & Elevation

Level 0
shadow: none
すべての要素。AMBUSH は完全フラット
Border Emphasis
border: 1px solid #000
シャドウの代わりにボーダーで強調
Surface Shift
bg: #f5f5f5
背景色の変化で奥行きを表現

09 / layout

Spacing & Width

Spacing Scale
4px xxs
8px xs
16px sm
24px md
32px lg
40px xl
48px xxl
56px xxxl
Content Widths
Full Bleed 100vw
Content Max 1100px
Article Text 600px