# Design System
Inspired by Webflow

Every color, font, and component — smarter sites start here.

Get started — it's free Contact sales

01 / Colors

## Color Palette

Primary
Near Black
#080808
Webflow Blue
#146ef5
Blue 400
#3b89ff
Secondary
Purple
#7a3dff
Pink
#ed52cb
Green
#00d722
Orange
#ff6b00
Yellow
#ffae13
Red
#ee1d36
Neutral
Gray 800
#222222
Gray 700
#363636
Mid Gray
#5a5a5a
Gray 300
#ababab
Border
#d8d8d8

02 / Typography

## Typography

Display Hero
WF Visual Sans — 80px / 600 / 1.04 / -0.8px
Sub-heading
WF Visual Sans — 32px / 500 / 1.30
Body — Smarter sites start here. Build your next project with the web platform.
WF Visual Sans — 20px / 400 / 1.50
Button Label
WF Visual Sans — 16px / 500 / 1.60 / -0.16px
UPPERCASE LABEL
WF Visual Sans — 15px / 500 / uppercase / +1.5px
MICRO LABEL
WF Visual Sans — 10px / 600 / uppercase / +1px

03 / Buttons

## Buttons

Get started
Primary Blue
Contact
Outlined
NEW
Badge

Hover to see translate(6px).

04 / Cards

## Cards

### Design

Build visually with a flexible canvas and production-ready code output.

### CMS

Create dynamic content with a powerful content management system.

### Interactions

Craft complex animations without writing a single line of code.

05 / Forms

## Forms

Email
Default
Project
Focus (blue ring)
Domain
Error
Description

06 / Spacing

## Spacing

4
8
12
16
24

07 / Radius

## Radius

2px
4px
8px
50%

08 / Elevation

## Depth

Flat
Border only
5-Layer
Cascading shadow stack