Model S

The original. Still the benchmark.

634km
Range (WLTP)
2.1s
0–100 km/h
322km/h
Top Speed

Model 3

Engineered for the everyday.

629km
Range (WLTP)
4.4s
0–100 km/h
201km/h
Top Speed

Model X

Utility, at full scale.

576km
Range (WLTP)
2.6s
0–100 km/h
262km/h
Top Speed

Cybertruck

Built different. Literally.

515km
Range (est.)
2.7s
0–100 km/h
209km/h
Top Speed
Tesla Energy

Generate, store, power everything.

The cars are one half of the mission. This is the other.

Solar Roof

Turn your roof into a power plant. Tiles, not panels — invisible until the bill arrives.

Learn More

Powerwall

Store sunlight, spend it at night. Whole-home backup that never asks for attention.

Learn More

Megapack

Utility-scale storage, shipping today. A grid that holds steady when demand does not.

Learn More
Design System Reference

结构即品牌: 全屏纵向的电影脚本

Tesla 的辨识度不在配色, 在信息架构本身: 一屏一辆车, 滚动即换幕. 每一幕的剧本完全相同 — 名字, 一句话, 一辆车, 三个数字, 两枚按钮 — 重复本身成为节奏, 黑与银交替成为剪辑. 页面不解释产品, 它放映产品.

View source ↗

Color

两块幕布轮流登场: 影院黑与银幕灰. 文字只有一种墨色和它的灰阶. 彩色被压缩到极限 — 蓝色只给链接与状态, 红色只属于词标. 当整个页面接近无彩, 车身的一道高光就是最亮的颜色.

幕布 Frames
影院黑
#000000
银幕灰
#F4F4F4
Tesla 墨
#171A20
次级灰
#5C5E62
纸白
#FFFFFF
克制的彩色 & 半透明层
电气蓝
#3E6AE1 · 链接/状态
词标红
#E82127 · 仅 logo
不锈钢
#CFD3D7 → #878D94
主 CTA 浅
#F4F4F4 · 88%
次 CTA 深
#171A20 · 55%

Typography

Inter 全场, 一种字体演完整部电影. 层级不靠字体切换, 靠尺寸与字距的两极: 车型名舒展, 规格数字收紧, 按钮全大写却只有 12px — 命令式的内容, 耳语式的音量.

Role样例字号字重字距
Model nameModel S44px600+0.04em
TaglineThe original. Still the benchmark.15px400+0.01em
Spec number634 km30px600-0.02em
Spec labelRange (WLTP)11px500+0.14em
CTA labelCustom Order12px600+0.2em
WordmarkTESLA17px700+0.42em

Radius

面板永远直角满幅, 像银幕本身. 圆角只出现在两个极端: 信息容器的轻微 4-8px, 与按钮的完整 pill. 唯一的正圆留给车轮.

面板
0 · 满幅直角
卡片
4px
容器
8px
CTA Pill
999px
车轮
50%

Components

组件只有一对 CTA, 一组规格, 一条导航 — 因为每一幕都只需要这三样. 半透明加背景模糊让按钮浮在任何画面上而不遮挡它; 规格组用细竖线分隔, 数字大, 标签小而疏.

CTA Pair · 浅幕 / 深幕
Spec Group
634km
Range
2.1s
0–100
322km/h
Top Speed

大数字 + 细竖线 + 疏排小标签. 数字本身就是文案.

Nav · mix-blend-mode: difference
TESLA Vehicles   Energy   Charging

导航固定悬浮, 白字以 difference 混合 — 黑幕上是白, 银幕上自动反相为墨色, 一套导航穿越所有幕布.

Voice & Tone

Tesla 的文案像规格表一样寡言. 每一幕只允许一个名词和一句陈述, 其余交给数字 — 不形容, 不感叹, 不挽留.

名词即句子

"Model S." 车型名加句号就是完整的标题.
tagline 限一句, 不超过八个词.
没有欢迎语, 没有 slogan 轰炸.

数字替代形容词

不说 "极致性能", 说 "2.1 s".
不说 "超长续航", 说 "634 km".
规格本身是诗, 形容词是杂音.

大写的低语

"CUSTOM ORDER" — 全大写却只有 12px.
字距拉开到 0.2em, 音量降到耳语.
命令式的内容, 克制的声压.

View source ↗