Design System
Inspired by Intercom

Every color, font, and component — visualized with warm precision.

Get a demoStart free trial
01 / Colors

Color Palette

Primary
Off Black
#111111
Primary text, buttons
Warm Cream
#faf9f6
Page background
Fin Orange
#ff5600
Brand accent
Report Palette
Blue
#65b5ff
Report blue
Green
#0bdf50
Report green
Red
#c41c1c
Report red
Pink
#ff2067
Report pink
Lime
#b3e01c
Report lime
Neutral
Gray 50
#7b7b78
Muted text
Gray 60
#626260
Secondary text
Oat Border
#dedbd6
Borders
Warm Sand
#d3cec6
Light neutral
02 / Typography

Typography Scale

Display Hero
Saans — 80px / 400 / 1.00 / -2.4px
Section Heading
Saans — 54px / 400 / 1.00 / -1.6px
Sub-heading
Saans — 40px / 400 / 1.00 / -1.2px
Feature Title
Saans — 24px / 400 / 1.00 / -0.48px
Body — The only AI-first customer service platform. Resolve issues instantly with Fin AI Agent.
Saans — 16px / 400 / 1.50
Body Light — Updated 3 minutes ago
Saans — 14px / 300 / 1.40
MONO LABEL
SaansMono — 12px / 500 / uppercase / +1.2px
03 / Buttons

Buttons

Get a demo
Primary Dark
Start free trial
Outlined
Learn more
Warm Cream

Hover to see scale(1.1). Click for scale(0.85). All buttons: 4px radius.

04 / Cards

Cards

Fin AI Agent

Resolve 50% of support questions instantly with AI. No training needed.

Help Center

Help customers help themselves. Build a knowledge base with AI-powered search.

Workflows

Automate repetitive tasks. Route, assign, and resolve at scale.

05 / Forms

Forms

Default (oat border)
Focus (black border)
Error (orange border)
06 / Spacing

Spacing

8
12
16
24
32
48
64
07 / Radius

Radius

4px
6px
8px

Sharp geometry: 4px for buttons, 6px for nav, 8px for cards.

08 / Elevation

Depth

Flat
No shadow — warm borders
Focus
Black border