Model Y

From $44,990 · Est. delivery this quarter

💬 Ask a Question“Where can I drive the Model 3?”
🚗  Schedule a Drive Today

Find Your Charge

Full-viewport photography carries each section; the interface stays out of the way.

Full Self-Driving

Navigate from parking spot to parking spot with the driver supervising.

Supervised

Model S

From $74,990

Model 3

From $38,990

Model X

From $79,990

Cybertruck

From $69,990

Small 4px rectangles

Primary · 40px · 4px radius · 14/500 — blue is the single primary action
Order Now Hover Disabled
Dark #171a20 · light #f4f4f4 — both 40px / 4px
Schedule Demo Hover Disabled Learn More Hover Disabled
Glass — rgba(0,0,0,.05) + backdrop-filter blur(16px) + 1px #d0d1d2, shown over photography
Ask a Question Hover Disabled Chip
Segmented control · 32px · 13/500 — rest and active
United StatesAustralia Rear-Wheel DriveLong Range AWDPerformance
Question chip as a field — default and focus
💬 Ask a Question“Where can I drive the Model 3?”
💬 Ask a QuestionWhat is the range of a Model Y?

Controls are deliberately understated — 4px rectangles at 40px, never pills. On-image legibility is solved with backdrop-filter: blur(16px) glass rather than scrims or cards. Motion is unusually slow: 0.33s on cubic-bezier(.5, 0, 0, .75), up to 0.5s on background-color, and even font and padding are animated so controls reflow smoothly. Full form-field states and focus rings were not captured.

Weight 500, everywhere

Section display · Universal Sans Display · 48/56 · 500 · normalFind Your Charge
Page h1 · Universal Sans Display · 40/48 · 500 · normalModel Y
Card h3 · Universal Sans Text · 17/20 · 500 · normalCybertruck
Nav link · Universal Sans Text · 14/20 · 500 · normalVehicles · Energy · Charging
Button label · Universal Sans Text · 13-14 · 500 (400 glass)Order Now
Utility / skip · Universal Sans Display · 12/16.97 · 500Skip to main content
Legal / footnote · Universal Sans Text · 12/18 · 400 · #5c5e62Price reflects motor vehicle incentives.

Everything cool-cast

Core
ink#171a20
blue#3e6ae1
white#ffffff
text-2#393c41
muted#5c5e62
faint#8e8e8e
border#d0d1d2
fill#f4f4f4
on-dark#eeeeee
Glass overlays — how controls sit on photography
glass-darkrgba(0,0,0,.05)
glass-lightrgba(255,255,255,.75)
glass-fillrgba(244,244,244,.85)
The one gradient — ink → blue → ink, 90deg

Blur instead of scrims

4px control
8px surface
0 8px 8px 0
16px
rgb(57,60,65) 0 2px 0 -1px — hairline as shadow
rgb(92,94,98) 0 2px 0 -1px — light hairline
rgba(0,0,0,.16) 0 8px 16px 0 — the one real lift
rgba(0,0,0,0) 0 0 0 0 — placeholder
backdrop-filter: blur(16px)
blur(4px) — animated state
blur(0px) — animated state

Backdrop blur is the primary depth mechanism — blur(16px) for glass controls, with blur(4px) and blur(0px) as animated states. Hairlines are drawn as hard shadows rather than borders. Motion: 0.33s cubic-bezier(0.5, 0, 0, 0.75) as the house curve, 0.5s on background-color and colour, and a font 0.33s, padding 0.33s transition so controls reflow rather than jump. Retina assets swap at (min-resolution: 192dpi). No WebGL or canvas.