01
02
03
04
Sätt ditt varumärkei arbete.
Designsystem
Ditt varumärke, som data.
Samlat som strukturerade design-tokens — inte skärmdumpar, inte en PDF.
Open studioImport
Tokens.definierade en gång, som data
◆Accent colour
#3a3a40
⛶
Derived scale
Typography
Aa
Inter · 800Display
▢Radius & spacing
Regler.läsbart för människa & maskin
✎Designregler
✓Primary actions use
accent.solid with white text.✓Body copy stays on
surface, minimum contrast AA.✕Never place
text/muted on surface-2.✕No gradients on interactive surfaces.
rules.json
{
"primary": { "bg": "accent.solid" },
"contrast": { "min": "AA" },
"gradients": false
}
Ett system,alla kunder.
Aurora
Sans · soft
Aa
Meridian
Serif · sharp
Aa
Halo
Grotesk · pill
Aa
Konsekvens,som standard.
tokens·core·
❖Components
ButtonSave
Input
you@studio.com
Toggle
Callout
Saved to your brand ✓
▤Wireframe
→ Designsystem
Ditt varumärke, samlat som strukturerade design-tokens.
01 Design-tokens
Färg, typografi, spacing & radius — samlat en gång, aldrig utspritt över CSS.
02 Designregler
Gör och gör-inte lever precis intill tokens — läsbara för både människor och maskiner.
03 System per kund
Ett designsystem per kund — typografin & formen ändras, verktygen aldrig.
04 Ekosystemet
Komponenter stylar sig själva från dina tokens; wireframes antar ett system. Konsekvens, som standard.
Aurora
Skrolla
IA
A sua IA, via MCP
Este é o módulo que mantém a sua IA fiel à marca. Lê sstm://design/tokens, as regras e a receita antes de construir — e pode adicionar ou afinar tokens com as ferramentas de design: um rebrand fica a uma conversa de distância.
Como funciona a validação humana
Design System · Premium — à la carte
Ponha Design System
a trabalhar.
A sua marca em design tokens estruturados.
Início de sessão com Cloudflare · workspace principal gratuito