Runway

runwayml.com10 colors4 componentsabcNormalMulti-page · 12 screens

Runway is building foundational Real-World Intelligence that is changing how the world’s top brands, companies, agencies and studios are able to tell their stories.

Remix Visit

Remix

Visit

12 screenshots captured· runwayml.com

1 / 12 · Runway | Intelligent tools for scaling content and teams. · Above the fold

Preview

the generated design system

Switch between the Visual preview, the rendered DESIGN.md and the Raw file.

Design tokens

Extracted from runwayml.com

Primary

#0C0C0C

Primary CTA, brand accent, active state; Headings / primary text

#9CA3AF

Accent / decorative

Neutral

#FFFFFF

Default page background; label colour on brand surfaces

#000000

Alternating section band

#404040

Body copy

#7C7C7C

Captions, secondary text

#A6A6A6

Tertiary / placeholder text

#666E7A

1px borders and dividers

#E5E7EB

Neutral

#1A1A1A

Neutral

Typography · abcNormal

body14px · 400 · 21.7px

body16px · 400 · 25.6px

body14px · 600 · 20px

body16px · 500 · 20px

link16px · 400 · 20.8px

nav-link16px · 500 · 24px

body13px · 400 · 16.9px

button11px · 450 · 14.3px

caption11px · 450 · 14.3px

caption12px · 400 · 16.8px

body16px · 600 · 24px

button16px · 400 · 24px

button15.0003px · 500 · 18.0004px

body13px · 500 · 15.6px

h179.999px · 400 · 83.999px

body20px · 400 · 31px

body18px · 400 · 28px

body14px · 500 · 14px

body24px · 400 · 30px

h156px · 400 · 53.76px

body14px · 600 · 13.3px

button24px · 400 · 30px

body20px · 600 · 28px

heading29.9994px · 400 · 35.9992px

heading36px · 400 · 40px

heading36px · 400 · 36px

body13px · 700 · 16.9px

display40px · 400 · 46px

h256px · 400 · 61.6px

display56px · 400 · 58.8px

h156px · 400 · 61.6px

h324px · 500 · 27.6px

h420px · 400 · 20px

body24px · 400 · 30px

display40px · 400 · 40px

button24px · 500 · 24px

h340px · 400 · 46px

table-header12px · 400 · 18px

caption12px · 500 · 16px

body13px · 500 · 16.9px

display45px · 400 · 40.5px

button14px · 400 · 13.3px

body14px · 400 · 13.3px

h256px · 400 · 58.8px

h329.9994px · 400 · 35.9992px

heading24px · 400 · 30px

heading18px · 500 · 25.2px

body20px · 400 · 25px

button13px · 500 · 15.6px

h318px · 500 · 25.2px

button14px · 400 · 20px

h324px · 400 · 30px

Typography · ui-monospace

code14px · 400 · 20px

code13px · 400 · 13px

Spacing

8px

24px

16px

12px

20px

4px

100px

40px

Elevation

rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px

Components · 4

Remixes of Runway

Latest remixes

No public remixes yet. Be the first to make one.

Remix it