Dark Mode

# Design System
Inspired by Intercom

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

Get a demo Start 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

Email
Default (oat border)
Company
Focus (black border)
Website
Error (orange border)
Message

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