472 of 500 seats leftBatch 1: 472 of 500 seats leftJoinJoin the waitlist
THE CONSOLE

And a toolto govern it all

Snapflow Cloud is where you see, audit and evolve every design system, with its agents, its components and its tokens. These are its screens.

PROJECTS

Every design system in the account

Each brand or product is its own project: who is in it, how many seats it takes, which frameworks it exports to, and the state of its license.

app.snapflow.design / acme / projects
ProjectsAcme
ProjectsOne project in this account.
A
Acme Webacme-web
Active
3MEMBERS
5SEATS
2FRAMEWORKS
reactvue
3 of 5
PROJECT

License, files and keys for each project

Each project shows its license with the seats in use, its Figma files (the one that carries the kit and the ones that consume it) and its license key.

app.snapflow.design / acme / projects / acme-web
ProjectsAcme
PROJECTAcme Webacme-web
LicenseActive
Seats3 of 5
Frameworksreactvue
Figma files
Acme KitKit
Acme Web · HomeConsumer
Acme Web · CheckoutConsumer
To use another file as the kit, open it in Figma and run "npx @snapflow-labs/onboard kit --rebuild". Working files keep the previous library until you publish the new one.
License keys
sfk_••••••••••3F9a
Created 3 days ago
Active
BRAND

The project's brand, editable in the console

The primary color generates the whole scale, from 50 to 950, and you see it right away in light and dark. The knobs move the radius, density, shadow and border of everything that depends on them.

app.snapflow.design / acme / projects / acme-web / brand
ProjectsAcme
ACME WEBBrandDraft saved.Ready to publish
Color
The primary color generates the brand's whole scale; buttons, links and accents use it in light and dark.
Primary color
brand · 600
Scale
50
100
200
300
400
500
600
700
800
900
950
LightA brand link
DarkA brand link
Knobs
Each knob moves every value that depends on it; none is changed on its own.
Corner radius6px
Spacing density4px
Shadow intensity1px
Border thickness1px
GETTING STARTED

From zero to your first screen

The journey ticks itself off as you go: framework, license key, installer, the Figma plugin, the kit and your first playground.

app.snapflow.design / acme / getting-started
Getting startedAcme
Getting started
GETTING STARTEDGet Snapflow runningWhat is left for Snapflow to work on your machine. Steps tick themselves off as you go.4 of 6 steps
The journey
Pick the base frameworkWhich framework your project's code is generated in.
Done
Your license keyWhat identifies your organization. You'll need it in the next step.
Done
Acmesfk_••••••••••3F9a
3
Install SnapflowOne command installs everything and leaves your assistant ready.
Pending
npx @snapflow-labs/onboard --license sfk_...
Open the plugin in FigmaSign in with the same account as this portal.
Done
5
Build and publish the kitYour assistant builds it with your brand; you publish the library.
Pending
Your first playgroundA sample project to try the code Snapflow generates.
Done
USERS

Who gets in, and with which role

Everyone with access to the account and the projects they work on, from the owner to the people who only read the system.

app.snapflow.design / acme / users
UsersAcme
UsersThree people with access to this account.
Email
A
ana@acme.co
Acme Web · owner
L
leo@acme.co
Acme Web · admin
M
mia@acme.co
Acme Web · reader
BILLING

Seats, cycle and add-ons, in one place

Monthly or annual, add or remove seats whenever you want, and add frameworks per project. Payments go through Stripe: the card never touches Snapflow servers.

app.snapflow.design / acme / billing
BillingAcme
BillingPlan, seats and invoices for this account.
BILLING CYCLE
SEATS
3Add or remove seats anytime, prorated.
Payment is processed by Stripe. Your card never touches Snapflow servers.
Order summary
3 seats × $32.50 × 12 months$1,170.00
Billing cycleAnnual
Annual cycle discount−$234.00
Due today$1,170.00
Renews automatically every year.
Framework add-onsIdentical tokens and accessibility across every framework.
VueExports Vue 3 components.
in 1 project$9.00 per seat / month

The agents

IN DEVELOPMENT

Three of them, and each one does a different job inside the system.

GOVERNOR

Derives the full ramp, the states and dark mode, and rejects the combinations that fail contrast.

AUDITOR

Checks the system against its own rules: token drift, accessibility, outdated versions.

COMPOSER

Builds the screens with the components that exist, never with new ones.

What's inside

The console's modules, from the project to the access.

01

Projects

Each brand or product is an independent design system, with its members, seats and frameworks.

02

License and seats

The project's plan, how many of the contracted seats it uses and which frameworks are enabled.

03

Figma files

The file that carries the kit and the ones that consume it, tied to the project and visible from the console.

04

License keys

One key per organization, with its status and the date it was created.

05

Users and roles

Who enters each project and with which role, from who governs the rules to who only consumes.

06

Billing

Monthly or annual cycle, seats, framework add-ons and invoices, in one place.

07

Getting started

The journey from the framework to your first playground, ticking itself off as you go.

08

API, CLI and MCP

Projects, components, tokens, exports and audit. Versioned, with an OpenAPI spec and your key to connect the agent.

ACCESS

Fifteen days free

When you're in, you connect your Figma and your repo, and the system takes your brand.

Join the waitlistSee the pricing