Back to Library
F

Figma

Figma

Visit Website

Collaborative design tool. Vibrant multi-color, playful yet professional.

多彩品牌画布界面协作设计组件系统

Color Palette

primary
secondary
accent
background
surface
text
muted
border

Typography

Heading FontInter, system-ui, sans-serif
Body FontInter, system-ui, sans-serif
Base Size14px
Line Height1.4
Weights400, 500, 600, 700

Heading Scale

h1Figma Heading
h2Figma Heading
h3Figma Heading
h4Figma Heading

DESIGN.md

# Figma Design System

## Visual Theme & Atmosphere
Playful yet professional. Multi-color brand signals creativity. Canvas-centric UI.

## Agent Prompt Guide
Multi-color brand palette. Canvas-centric design tool layouts.

Related Design Systems

F
Framer
Framer
Similar design tool design system
W
Webflow
Webflow
Similar design tool design system
S
Stripe
Stripe
Similar style design system

Frequently Asked Questions

What is Figma's design style?

Collaborative design tool. Vibrant multi-color, playful yet professional.

What is Figma's primary color?

Figma uses #F24E1E as primary color, #FFFFFF for background, and #1E1E1E for text.

What fonts does Figma use?

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

How to use Figma 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 Figma's style.

Explore More Design Systems

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

View All Design Systems