Section 01 / Palette

Color Palette

Velvet black canvas, showroom white type, one gray for the quiet moments. No accents. The product provides the color.

Primary
Velvet Black
#000000
The entire canvas. A display-stand surface — the way a jewelry brand treats black velvet.
Showroom White
#FFFFFF
All text, all borders, all CTAs. The only color at rest on the chrome.
Secondary
Silver Mist
#999999
The one gray. Tertiary text, disabled states, secondary button borders. Never a color — just quieter white.
Accent
None
—
Bugatti does not use accent colors. The car paint is the accent. The chrome stays silent.
Section 02 / Typography

Typographic Hierarchy

Bugatti Display for monumental headlines. Bugatti Monospace for every UI label. Bugatti Text Regular for body. No bold, only scale.

Monumental HeroBugatti Display · 288px / 400 / 1.00
BUGATTI
Mid DisplayBugatti Display · 60px / 400 / 1.00 / 1.4px
The F.K.P. Hommage
Section HeadingBugatti Display · 36px / 400 / 1.11
A tribute to visionary creation
Monumental MonoBugatti Monospace · 60px / 400 / 1.00
W16 / 1600HP
Lead BodyBugatti Text Regular · 20px / 400 / 1.40
Honoring the vision and the visionary creator, this chapter of Bugatti's history is dedicated to the founding spirit of the marque.
Body RegularBugatti Text Regular · 16px / 400 / 1.50
Standard reading body copy for the rare paragraph moments where narrative context supports the imagery.
UI Link / ButtonBugatti Monospace · 14px / 400 / 1.43 / 1.4px / UPPER
Explore our opportunities
Compact ButtonBugatti Monospace · 12px / 400 / 1.33 / 1.2px / UPPER
Menu
Caption WideBugatti Monospace · 14px / 400 / 1.43 / 1.4px
Molsheim, France · 2026
Caption MicroBugatti Monospace · 12px / 400 / 1.33
Photography by the Bugatti Atelier
Section 03 / Buttons

Button Variants

Full-pill or slightly-rounded utility. Transparent fills with 1px borders. Mono caps labels only.

Primary — Outlined Pill
Inverted — Filled Pill
Secondary — 6px Utility
Ghost — Unbordered
Section 04 / Media Chapters

Film Chapters

Bugatti has no cards. It has cinematic chapters — full-bleed media with an overlaid headline and single CTA.

Chapter 01 · Molsheim

Handcrafted in the atelier

Read the Story
Chapter 02 · Engineering

1600 horsepower of quiet ambition

Discover the W16
Section 05 / Forms

Inputs

The homepage has no forms. When they appear on deeper pages, they follow the same restraint: 6px radius, Silver Mist border, no color accents.

Please enter a valid address
Section 06 / Spacing

Spacing Scale

Six discrete values — one of the smallest spacing scales in this catalog. Bugatti refuses to invent in-between gaps.

4px
6px
12px
36px
48px
64px
Section 07 / Radius

Border Radius Scale

Three values. Rectangle, slightly-rounded utility, or full pill. Nothing in between.

0Default — media, hero
6pxUtility, small frames
9999pxPrimary pill buttons
Section 08 / Elevation

Depth & Elevation

Hairline borders only. No drop shadows anywhere. The only gradient is a vignette over video for text legibility.

Level 0
No shadow, no border — plain canvas
Level 1
1px solid Silver Mist — secondary containers
Level 2
1px solid Showroom White — primary state
Level 3
Bottom vignette — text legibility over media