mdshop
Back to designs
S

Design System inspired by SpaceX

Aerospace. Stark dark theme, full-bleed rocket photography, futuristic minimal.

Usage
npx getdesign@latest add spacex

Run this command from your project root, then ask your AI assistant to use DESIGN.md for UI work.

Installs
7
Bookmarked
0
Not an official SpaceX design system. A curated starting point for building SpaceX-like UIs with your AI coding agent.

Aerospace. Stark dark theme, full-bleed rocket photography, futuristic minimal.

Preview
spacex.design.md
Brand System Catalog

DESIGN SYSTEM INSPIRATION OF SPACEX

Aerospace. Stark dark theme, full-bleed rocket photography, futuristic minimal.

Explore the systemView tokens

Color Palette

Aerospace. Stark dark theme, full-bleed rocket photography, futuristic minimal.

Primary
Near Black
#0b0e11
Brand color
White
#ffffff
Brand color
SpaceX Blue
#005288
Brand color
Gray
#a0a0a0
Brand color
Dark Surface
#1a1a1a
Brand color
Accent
#4bb4de
Brand color

Typography

A type system inspired by SpaceX.

D-DIN
D-DIN, D-DIN
DISPLAY / 64px / 700 / 1.1
EVERYONE
H1 / 48px / 700 / 1.2
A disciplined editorial voice
H2 / 32px / 600 / 1.3
Section heading
BODY / 16px / 400 / 1.6
Body copy reads at the size and rhythm extracted from the source spec. Lorem ipsum dolor sit amet.
SMALL / 14px / 400 / 1.5
Small
CODE / 14px / 400 / 1.6
Code

Buttons

Buttons, cards, and inputs follow the brand's visual language with consistent use of the primary color palette and border-radius conventions.

Not detected on this URL

Cards

Card patterns inspired by SpaceX.

Not detected on this URL

Components

Other component primitives mapped from the SpaceX spec.

Not detected on this URL