Before
Page Speed38/100
Bounce Rate82%
Conversions0.4%
After
Page Speed98/100
Bounce Rate24%
Conversions+340%
L
Logic Layer Solution
logiclayersolution.uk
before
after
We Build Digital Experiences
That Drive Growth.
150+
Projects
98%
Satisfied
8yr
Experience
All work
DevTool · 2025

Tessellate — design token CLI + dashboard

CLI + dashboard for managing design tokens across Figma, code, and design system docs — without manual sync.

Client
Tessellate (acquired by Figma)
Industry
DevTool · Design ops
Duration
10 weeks (initial), ongoing
Year
2025
CLITypeScriptFigma
app.tessellate.io / dashboard
Tessellate
Overview
Fleets
Alerts
Logs
Team
Settings
Fleet overview
Real-time · all regions
Live
P75 latency
340ms
−92%
Active fleets
1,284
+22%
Uptime
99.99%
—
Throughput · 24h
By region
Top events
event_1156
event_2290
event_3424
Fig. 01 — Production UI · 2025Tessellate (acquired by Figma)
Year
2025
Category
DevTool · 2025
Stack
CLITypeScriptFigma
Scope
  • CLI design (Node + TypeScript)
  • Figma plugin
  • Dashboard UI
  • Git integration (PR-ready commits)
  • Theme branching system
Start a similar project
The challenge

What they needed to solve.

Tessellate's customers were maintaining design tokens in three places (Figma, JSON, code) and syncing them by hand. Token drift was unmanageable. The existing dashboard was a list view of 6,000+ tokens with no diff or history.

Our solution

How we approached it.

A token-aware CLI that diffs Figma against your codebase, suggests PR-ready commits, and serves a clean dashboard with visual diffs, history, and theme branching. Acquired by Figma 8 months after launch.

Web design

Design decisions.

Palette
#0e1116
#f8f9fc
#fb923c
#a78bfa
#22d3ee
Typography
  • AaGeist Sans — UI
  • AaGeist Mono — CLI output + code
Layout system

Diff-first UI. Every change has a before/after pair. CLI output mirrors dashboard structure exactly.

Design highlights
  • Side-by-side diff viewer for every token
  • Theme branching like git branches
  • CLI output uses the same iconography as dashboard
Before · After

What changed.

app.tessellate.io / dashboard
Tessellate
Overview
Fleets
Alerts
Logs
Team
Settings
Fleet overview
Real-time · all regions
Live
P75 latency
340ms
−92%
Active fleets
1,284
+22%
Uptime
99.99%
—
Throughput · 24h
By region
Top events
event_1156
event_2290
event_3424
After
app.tessellate.io / dashboard
Tessellate
Overview
Fleets
Alerts
Logs
Team
Settings
Dashboard
Last updated 04:12
Refresh
P75 latency
4.2s
−
Active fleets
412
−
Uptime
97.1%
−
Activity
By region
Top events
event_18
event_216
event_324
Before
Drag to compare ←→
Fig. 02 — Drag handle to reveal before / afterTessellate (acquired by Figma)
app.tessellate.io / dashboard
Tessellate
Overview
Fleets
Alerts
Logs
Team
Settings
Dashboard
Last updated 04:12
Refresh
P75 latency
4.2s
−
Active fleets
412
−
Uptime
97.1%
−
Activity
By region
Top events
event_18
event_216
event_324
Before

Manual 3-way sync (Figma / JSON / code), 6,000-row table, no diff or history, no theme branching.

Token drift
18%
Sync time / wk
6 hrs
Theme branches
0
Conflicts / wk
11
app.tessellate.io / dashboard
Tessellate
Overview
Fleets
Alerts
Logs
Team
Settings
Fleet overview
Real-time · all regions
Live
P75 latency
340ms
−92%
Active fleets
1,284
+22%
Uptime
99.99%
—
Throughput · 24h
By region
Top events
event_1156
event_2290
event_3424
After

CLI-driven diffs, theme branching, dashboard with history, PR-ready commits — fully automated.

Token drift
<1%
Sync time / wk
15 min
Theme branches
Unlimited
Conflicts / wk
0
Results

What we measured.

01Manual token sync eliminated for 240 teams
02Average token drift dropped from 18% to <1%
03Acquired by Figma in 8 months
04Used internally at Stripe, Shopify, Airbnb pre-acquisition
Previous
Nimbus — cloud storage marketing site
Next
Solstice — sleep coaching app