Webflow

Visit Website

Visual web builder. Blue-accented, polished marketing site aesthetic.

蓝色强调视觉构建营销网站无代码

Color Palette

primary

background

surface

text

muted

border

Typography

Heading FontInter, system-ui, sans-serif

Body FontInter, system-ui, sans-serif

Base Size16px

Line Height1.5

Weights400, 500, 600, 700

Heading Scale

h1Webflow Heading

h2Webflow Heading

h3Webflow Heading

h4Webflow Heading

DESIGN.md

# Webflow Design System

## Visual Theme & Atmosphere
Polished visual builder. Blue with clean marketing aesthetics.

## Agent Prompt Guide
Blue-accented marketing theme. Visual builder panel layouts.

Related Design Systems

Framer

Similar design tool design system

Figma

Similar design tool design system

Frequently Asked Questions

What is Webflow's design style?

Visual web builder. Blue-accented, polished marketing site aesthetic.

What is Webflow's primary color?

Webflow uses #4353FF as primary color, #FFFFFF for background, and #1A1A2E for text.

What fonts does Webflow use?

Heading font: Inter, system-ui, sans-serif. Body font: Inter, system-ui, sans-serif. Base size: 16px.

How to use Webflow design system in my project?

Click the Copy button above the DESIGN.md code block to copy the complete design specification. AI Coding tools like Cursor can directly read DESIGN.md to generate code matching Webflow's style.

Explore More Design Systems

Discover 50+ curated design systems for your AI Coding projects.

View All Design Systems