Tokora Studio
Sign in Join Now for Free

Build design systems, websites, and products. Fast. Free.

Customize your Tokora Library with type and color generators, or any design tokens, then build anywhere using Tokora MCP, AI skills, Tokora Canvo connector, CLI, and production-ready Fluxo or Nuvo components.

  • 45AI Skills
  • 23Components
  • 8Tech Stacks
  • 3Automation
Get Started Browse components

Everything you need to build beautiful and consistent UI.

AI tools can create polished interfaces in seconds, but without your design system, they are still guessing. Give agents your approved components, tokens, styles, skills, and live library context so every output stays true to your source of truth.

  1. Color Palettes

    Choose a color profile and contrast model, then generate and fine-tune an accessible palette. Your library colors and component styles stay automatically in sync.

    • Accessible
    • Bound to semantic tokens

  2. Typography

    Choose fonts, base size, ratio, steps, and spacing. Your library typography and component styles stay automatically in sync.

    • Responsive
    • Bound to tokens

  3. AI Skills

    Install all 45 registered AI workflows and style profiles for design intent, website design, front-end work, responsive adaptation, and accessibility.

    • 45 Skills
    • Design
    • UX
    • Audit

  4. Components

    Use 23 accessible components with canonical variants, token bindings, runtime behavior, and light and dark modes built in.

    • 23 Components
    • Canonical
    • Token Bindings

  5. Tech Stacks

    Use Fluxo, Nuvo, Tokora MCP, the Canvo plugin, Tokora Connect, JSON, CSS, and command-line install paths.

    • Fluxo
    • Nuvo
    • MCP
    • CLI
    • Canvo

  6. UX Guidelines

    Guide agents with product direction, governance, brand, composition, content, inclusive UX, visual principles, and accessibility.

    • Accessibility
    • Governance
    • Composition

One flow from zero to ready.

A tool for colors. Another for type scale. Another for components. Another for Canvo. Another for Kortex or Aurin.

Tokora brings scattered workflows into one synced flow, from setup to shipping.

Pick base size, ratio, steps, fonts, and spacing. Tokora binds the type scale into semantic tokens, so every heading and body style updates at once.

HEXRGBHSL
#235CD7
  • vs dark surface3.14:1 FAIL
  • vs white6.67:1 AA

Generate an accessible palette, choose your contrast model and color profile, then fine-tune the balance. Tokora binds it into semantic color tokens so component styles update instantly.

Every component reads the same tokens. Change a ramp or a step and 23 components, in light and dark, follow without a single manual edit.

MCPSkillsCode
$ npx tokora-library add button card badge

Export the same library as install commands, Fluxo or Nuvo components, token JSON, or plain CSS custom properties.

One library. Every surface.

Foundations, components, skills, and code stay in one place — and every tool you connect reads the same source of truth.

A component library you need to build websites.

Install product-ready Fluxo and Nuvo components, insert token-bound components into Canvo, and give AI agents the same component contracts through Tokora design skills—all from one library for consistent, accessible interfaces in light and dark.

Accordion
Alert
Badge
Breadcrumb
Button
Card
Checkbox
Date Picker
Dropdown
Icon
Input
Modal
Pagination
Popover
Progress Bar
Progress Indicator
Radio
Table
Tabs
Text Input
Textarea
Toggle
Tooltip
Breadcrumb
$ curl -fsSL https://tokora.example/install-mcp-helper.sh | sh

The source of truth for AI code agents. Ready.

Connect your Tokora library to Canvo, Karet, Aurin, and Kortex in a few clicks, so every AI agent works from the same source of truth.

Explore Tokora MCP Install AI Skills

How Tokora Works

Customize your Tokora Library with type and color generators or any tokens, then install AI skills, connect your AI tools through MCP, use the Tokora Connector in Canvo Agents, or add Fluxo or Nuvo components so every agent starts from the same source of truth.

  1. Tokora MCP: Context for AI agents

    The Tokora MCP panel listing the tokens and components an agent can read.

    Connect Aurin, Karet, Kortex, and Astera to your Tokora Library through MCP so they can build with your design tokens, components, rules, and patterns for consistent, accessible websites, apps, or tools.

    Explore Tokora MCP

  2. Tokora Canvo plugin

    Install the “Tokora Library for Canvo” plugin, then connect your Tokora Library to insert its design tokens and components into your active Canvo file.

    Explore Canvo Plugin

  3. Install Fluxo components

    The Install Code screen generating Fluxo components from the library.

    Open Install Code, choose Fluxo component output, then generate and run the install command inside your app repo. Tokora creates ready-to-use components with your library’s tokens, variants, contracts, and accessible structure.

    Install Fluxo code

  4. Install Nuvo components

    The Install Code screen generating Nuvo components from the library.

    Choose the Nuvo 3 output instead and run the same command. The components ship with the same tokens, the same variants, and the same accessible structure as their Fluxo siblings.

    Install Nuvo code

  5. Design skills for AI agents

    Open AI Skills, choose Kortex, Aurin, or Astera, then run the install command inside your project. Tokora adds design, website, front-end, responsive, and accessibility skills so your agent can plan, build, and review from the same source of truth.

    Install AI Skills

Step 1 of 5 — Tokora MCP: Context for AI agents

A team working together on a design system. The colour binding dialog, open over the library.

A tool that gives your time back

Accessibility up front

Type Scale Generator and Palette Generator help you hit readable type and accessible color contrast before anything ships.

Start with a ready-to-use library

Drop in 23 components that are already tokenized and ready to customize, so you spend time designing, not setting up.

Save time and money

Tokora helps teams skip the slow part. It handles the foundation layer so you can focus on patterns, variants, and onboarding.

Pricing

Try Tokora Library for free. Use your Tokora Library with Install Code, AI Skills, Tokora MCP, and the Tokora Canvo plugin, or choose Enterprise for unlimited libraries and library switching.

Free

Start here

Customize your Tokora Library with your type, colors, tokens, and component styles, then preview the results locally.

$0/ always

Included

  • 1 design system
  • Type Scale Generator
  • Palette Generator
  • Light + Dark themes
  • Component demo
  • Token management
  • A11y audit
  • Automated documentation
  • Tokora MCP
  • 45 AI design skills
  • Fluxo component preview
  • Nuvo component preview

Limits

  • Browser-local save
  • No downloads
  • No Canvo plugin package
Try for Free

Pro

1 library

Use your Tokora Library in production with Install Code, AI Skills, Tokora MCP, and the Tokora Canvo plugin.

$49/ First library on Tokora

Everything in Free, plus

  • 1 design system
  • 45 AI design skills
  • Fluxo component install
  • Nuvo component install
  • Tokora MCP server
  • Canvo plugin
  • E-mail support

Limits

  • No extra design systems
  • No library switching
Use Tokora for Free

Enterprise

Unlimited

Create and switch between unlimited libraries for brands and client work.

$490/ Lifetime access
One-time payment

Everything in Pro

  • Unlimited design systems
  • Switch between libraries
  • 45 AI design skills
  • Priority support and onboarding
Go Enterprise
CapabilityFreeProEnterprise
Design systems11Unlimited
Type scale generatorYesYesYes
Palette generatorYesYesYes
ThemesLight + DarkLight + DarkLight + Dark
Token managementYesYesYes
Component demoYesYesYes
Automated documentationYesYesYes
A11y auditYesYesYes
AI context
Tokora MCPYesYesYes
AI design skills454545
Code and Canvo
FluxoPreviewCode exportCode export
NuvoPreviewCode exportCode export
Tokora library for Canvo pluginNoYesYes
Limits
Save and downloadsBrowser-localDownloads includedDownloads included
Extra design systemsNoNoUnlimited
Library switchingNoNoYes
Team
SupportE-mailE-mailPriority support

Questions?
Answers!

Need further help or personalized assistance? Reach out to us and we will help you choose the right Tokora license for your workflow.

Contact Us
What is an Tokora Library?

An Tokora Library is one design system workspace. It includes your type, color, tokens, semantic mappings, component setup, documentation, accessibility audits, AI Ready package, and export settings.

What is included in Free?

Free includes one design system, type scale and palette generators, light and dark themes, component demo, token management, A11y audit, automated documentation, Tokora MCP, and preview access for design.md, Fluxo, and Nuvo.

When should I choose Pro?

Choose Pro when you are ready to use one Tokora Library in production. It adds design.md download, Install Code for Fluxo and Nuvo, the Tokora MCP server, AI skill files, the Canvo plugin package, and e-mail support.

When should I choose Enterprise?

Choose Enterprise when you manage multiple design systems, brands, or clients. It adds unlimited design systems, library switching, unlimited AI skill files, and priority support and onboarding.

Is Enterprise a subscription?

No. Enterprise is a one-time purchase for lifetime access to the Enterprise scope shown here, unless checkout or a written agreement says otherwise.

Does Enterprise include team seats?

Not yet. Enterprise is currently a single-account license. You can share exported outputs with clients, collaborators, developers, or implementation partners, but they need their own Tokora account if they want to use Tokora directly.

How do I get support?

Free and Pro include e-mail support at info@example.com. Enterprise includes priority support and onboarding through the same contact.

Do I need Canvo to use Tokora?

No. Tokora is a standalone design system workspace. Canvo-related workflows are available if you want to connect or insert design-system resources into Canvo.

What can I export from Tokora?

Tokora can export design.md, design tokens, CSS, Fluxo, Nuvo, MCP server materials, AI skill files, and Canvo plugin packages depending on your plan.

Can I use Tokora outputs in client work?

Yes. You can use Tokora outputs in client projects, websites, apps, repositories, Canvo files, and production codebases. You can also deliver outputs to a specific client as part of a custom project.

Ready to ship beautiful Interfaces?

Bring your Tokora Library into Aurin, Kortex, Astera, and Canvo.

Build everywhere with the same tokens, components, and design guidance.

Browse Tokora library Install code