Cursor

cursor.com15 colors6 componentssystem-uiMulti-page · 12 screens

Built to make you extraordinarily productive, agents turn ideas into code. Accelerate development by handing off tasks to Cursor.

Remix Visit

Remix

Visit

12 screenshots captured· cursor.com

1 / 12 · AI Coding Agent for Building Ambitious Software | Cursor · 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 cursor.com

Primary

#EDECEC

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

#26251E

Brand hue used alongside the achromatic primary; Captions, secondary text

#EB5600

Inline link colour

#F54E00

Accent / decorative

#C08532

Accent / decorative

#3A6A9F

Accent / decorative

#238636

Accent / decorative

Neutral

#14120B

Default page background; label colour on brand surfaces

#1B1913

Card / panel background

#F7F7F4

Alternating section band

#969592

Body copy

#000000

Tertiary / placeholder text

#FFFFFF

Neutral

#E6E5E0

Neutral

#0A0A0A

Neutral

Typography · system-ui

body13px · 400 · 20.15px

caption12px · 500 · 16px

input13px · 400 · 17.3333px

button12px · 400 · 16px

heading14px · 600 · 21.7px

button11px · 400 · 14px

caption12px · 400 · 16px

caption11px · 400 · 13.75px

label16px · 400 · 24px

button12px · 500 · 16.2px

button14px · 400 · 20px

body13px · 600 · 17.3333px

caption11px · 500 · 14px

button14px · 600 · 20px

Typography · CursorGothic

body14px · 400 · 21px

body16px · 400 · 24px

caption12px · 400 · 18px

h272px · 400 · 79.2px

h322px · 400 · 28.6px

body16px · 400 · 16px

link14px · 400 · 21px

button16px · 400 · 24px

heading36px · 400 · 43.2px

h136px · 400 · 43.2px

list-item16px · 400 · 24px

body26px · 400 · 32.5px

button14px · 400 · 20px

h126px · 400 · 32.5px

h152px · 400 · 59.8px

body14px · 400 · 21px

label16px · 400 · 16px

body14px · 500 · 21px

button14px · 400 · 14px

h314px · 400 · 21px

h252px · 400 · 59.8px

Typography · berkeleyMono

code12px · 400 · 19.5px

code13px · 400 · 18.5714px

input12px · 400 · 20px

code11px · 400 · 14.6666px

Typography · cursorSans

body15px · 400 · 24.375px

h133.75px · 400 · 40.5px

h220.625px · 400 · 26.8125px

link16px · 400 · 24px

table-header12px · 400 · 16px

heading12px · 400 · 18px

caption12px · 400 · 20px

button12px · 400 · 17.1429px

body15px · 700 · 24.375px

button14px · 400 · 20px

body14px · 700 · 20px

h318px · 400 · 27px

list-item15px · 400 · 22.5px

nav-link14px · 400 · 20px

body15px · 700 · 22.5px

Typography · EB Garamond

body17.28px · 400 · 23.328px

Typography · Lato

body14px · 400 · 18.6666px

Spacing

4px

8px

12px

16px

24px

20px

32px

52px

Elevation

rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px

rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.02) 0px 0px 16px 0px, rgba(0, 0, 0, 0.008) 0px 0px 8px 0px

rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.1) 0px 1px 2px -1px

rgba(0, 0, 0, 0.3) 0px 2px 16px 0px, rgba(0, 0, 0, 0.2) 0px 1px 6px 0px

Components · 6

Remixes of Cursor

Latest remixes

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

Remix it