Build interfaces that feel right

100+ accessible, customizable components for React, Vue, Angular, and Blazor. One design system. Your code. Ship faster.

$npm install -g @ajax-ui/cli

Then ajx init in your project to wire it up.

React Vue Angular Blazor
100+
Components
4
Frameworks
WCAG 2.1
AA Compliant
MIT
License
The library

Every component, themeable

Each token - color, radius, spacing - is a CSS variable. Drop them in, theme them once, ship everywhere.

Get startedCancel

Button

Five variants, loading & icon states.

Pro plan

Card

Composable header, body, footer slots.

NewBetav2.4

Badge

Status, counts, and tags.

Delete project?
This action can't be undone.
CancelDelete

Modal

Focus-trapped, escape to close.

Profile
Billing
Sign out

Dropdown

Keyboard navigable menus.

SavedChanges synced.

Toast

Stacked, auto-dismissing alerts.

Preview
Code
Tokens
Live, accessible tab panels.

Tabs

ARIA roles wired by default.

Why Ajax UI

Built to move fast, built to last

A production design system that respects your stack, your tokens, and your users.

Blazing fast

Tree-shakeable and zero-runtime where it counts. Ship only the components you actually import.

Fully customizable

Every color and radius is a CSS variable. Theme once, restyle everything - no fork required.

Accessible by default

WCAG 2.1 AA out of the box - focus management, ARIA roles, and keyboard nav already wired.

Multi-framework

One design system, four bindings - React, Vue, Angular, and Blazor stay perfectly in sync.

Dark mode ready

Light and dark themes ship in the box, driven entirely by tokens. Toggle with a single class.

CLI tooling

Scaffold, add, and update components from the terminal - ajaxui add drops in source you own.

AI-native

Built for AI-assisted coding

Two MCP servers expose components, presets, and versions as typed tools - so AI editors fetch exactly one component instead of drowning in your whole catalog.

MCP-native catalog

@ajax-ui/mcp-ui and mcp-presets serve the full library to Cursor, Claude Desktop, and Windsurf.

Surgical retrieval

The model pulls a single component's source on demand - no dumping thousands of tokens into context.

Typed metadata

Props, variants, and version info arrive as structured tools - the assistant always knows the correct API.

Without MCP~12,480 tokens
// entire component catalog
// pasted into the prompt
Context bloated, slower, and error-prone.
With Ajax UI MCP~320 tokens
list_components()
get_component_source("button")
add_component_command()
One component, surgically. Fast and exact.
Set up the MCP server
Fintech-ready

Built for money, not just interfaces

Banking, checkout, trading, and fraud surfaces ship as first-class components - amounts travel as integer cents, formatting is Intl-correct, and Pix, boleto, and parcelamento are built in.

Banking & payments

Money input, currency converter, account balances, transaction feeds - plus the Brazilian trio: Pix, boleto, and CPF/CNPJ validation.

Checkout

Card entry with Elo and Hipercard detection, Luhn validation, CEP autofill hooks, and installment options with Price-table interest.

Trading & investing

Candlesticks, sparklines, order books, tickers, portfolio and P&L cards - dependency-free SVG that stays crisp at any DPI.

Risk & fraud

Risk-score badges, device trust, location mismatch, and suspicious-activity alerts - the surfaces compliance teams ask for.

Explore the finance components
FAQ

Questions, answered

Is Ajax UI free to use?
Yes. Ajax UI is open source under the MIT license - free for personal and commercial projects, with no attribution required. You own the components you add to your codebase.
Which frameworks are supported?
React, Vue, Angular, and Blazor - all four share one design system and identical tokens, so a theme built once renders consistently across every binding.
How do I install it?
Install the CLI with npm install -g @ajax-ui/cli, run ajx init to scaffold your config, then add components as you need them with ajaxui add button.
Can I customize the design tokens?
Completely. Every color, radius, and spacing value is a CSS variable. Override them in one place - or use the preset editor - and the entire component set restyles instantly, including dark mode.
Is it accessible?
Every component meets WCAG 2.1 AA. Focus management, ARIA roles, keyboard navigation, and reduced-motion support are wired in by default - accessibility isn't an add-on.
How do I get started?
Read the docs for a five-minute quickstart, install the CLI, and drop your first component in. AI editors can also pull components directly through the MCP server - no manual copy-paste.

Ready to build
something great?

Join the developers shipping faster with one design system across every framework.