Version 1.6.1 FREE
A UI kit AI agents read,
smartwebUI
A UI kit AI agents read,
humans enjoy, and teams trust.
Design and ship high-quality web apps faster, with one design system shared by managers, designers, developers, and AI agents. Start in Figma, build with semantic HTML and design tokens, then let agents compose and update validated interfaces safely. No compiler, framework runtime, or lock-in. Simplicity at its core.
Explore
Learn more
Download
Inspired by Apple’s design principles and crafted with care. Includes four customizable styles: Solid, Liquid, Minimal, and Relief.
Why smartwebUI
The interface stays yours, even when an agent composes it.
smartwebUI does not ask you to replace the web with an application framework. It gives humans and agents the same small, trusted component language, rendered as semantic HTML — built for modern web apps, storefronts, and the agents that operate them.
Agent intent→Validated surface→Trusted HTML→Live patches
Live without a framework
Modern HTML and CSS remain the public API. PHP or any server stack can render it directly, with no build system between your application and the browser.
Smart by contract
A machine-readable catalog teaches agents each component’s intent, properties and accessibility rules. Agents compose approved UI through surfaces — or write the same semantic HTML directly.
Dynamic
Stable component IDs accept small validated patches. Data and interface regions can change in real time while focus, semantics and motion remain coherent.
Modern by policy
smartWebUI sets a fixed September 2024 baseline, Chrome and Edge 129+, Firefox 130+, and Safari 18+. The Popover API, native dialogs, cascade layers and view transitions are used unapologetically. No legacy bundles, no polyfills; an optional banner politely asks out-of-date visitors to update.
E-commerce ready
An optional Stripe companion maps your design tokens onto Elements appearance and re-syncs with every theme, density or material change. Agents request a payment slot — only your server ever touches keys, secrets or amounts.
Global and accessible
Logical properties mirror the whole interface under dir="rtl", dates and currencies format through Intl, and every interactive component ships its focus, keyboard and ARIA behavior as part of the contract.
Generative UI
Chat answers become interfaces.
Chat products are moving past text replies. Ask for churn by quarter, today's orders, or a booking flow, and the answer is a dashboard, a card, a tiny app — rendered right in the conversation. smartwebUI is the component language those replies are made of: for Electron shells and web-based chat hosts alike.
smartwebui.surface/1.0what the model actually sends
{
"surface": "chat.7",
"root": {
"type": "Stack", "id": "churn",
"children": [
{ "type": "Card", "id": "kpi",
"label": "Churned accounts",
"value": "38", "change": "-6 vs Q3" },
{ "type": "Table", "id": "accounts",
"columns": [
{ "key": "account", "label": "Account" },
{ "key": "plan", "label": "Plan" },
{ "key": "mrr", "label": "MRR" } ],
"rows": [
{ "id": "r1", "cells": { "account": "Northwind Co." } } ] },
{ "type": "Button", "id": "open",
"label": "Open accounts",
"action": "open_accounts" }
]
}
}
Validated against the component catalog, themed by your tokens, rendered as trusted HTML — or server-rendered in PHP before a single script runs.
Safe by construction
Model output is never HTML. Every surface validates against the catalog and fails closed — no injected markup, no script ride-alongs, links and sources policy-checked. Render agent replies without a sanitizing audit.
Cheaper than generated code
A full dashboard is a few hundred tokens of JSON, not a page of markup the model has to invent — and every reply inherits the design system's polish, spacing and states for free.
First paint on the server
The dependency-free PHP renderer emits the same semantic HTML the browser runtime adopts, so web-based hosts can stream server-rendered replies before any client script runs.
Alive in the conversation
Replies stream in token by token, edits arrive as small validated patches, mistakes undo — and dashboards keep themselves current with live regions long after the message lands.
Building a chat product and want to ship these surfaces inside it? Web hosts run smartwebUI free — commercial embedding licenses cover desktop apps, SDKs, and white-label builds.
The philosophy
Fewer layers, more web.
Every few years our industry rebuilds the browser inside the browser — a new compiler, a new runtime, a new abstraction to learn and abandon. Meanwhile the platform quietly became good: native dialogs, the Popover API, cascade layers, light-dark(), view transitions. smartwebUI is a bet that the best framework is the one you already shipped, and that the next decade of software — written increasingly with and by agents — needs smaller, safer surfaces on what is already there, not thicker ones on top of it.
The platform is the framework
Semantic HTML is the public API. When the browser already owns dialogs, popovers, and focus management, re-implementing them is debt, not engineering. smartwebUI styles and orchestrates the platform — it never replaces it.
Ship what you read
The file you copy is the file that runs. No compiler stands between your application and the browser, so view-source is documentation, debugging ends at your own code, and a page that renders on the server renders for everyone.
Enhancement, not replacement
Everything meaningful works before JavaScript arrives — forms post, details disclose, dialogs open. Behavior is a layer that upgrades the page, never a prerequisite for it. First paint belongs to the server.
Accessibility is the floor
Native elements first, ARIA only where the platform stops. Keyboard paths, focus return, contrast, and reduced-motion support are release gates with documented acceptance criteria — not backlog tickets.
Machine authors need boundaries
Agents compose interfaces through a validated surface contract — raw HTML does not belong in JSON declarations. Hand-authored smart-* HTML and server-rendered markup remain the public API. The renderer refuses what it does not recognize by construction, so trusting surface output is a property of the system, not a policy you enforce alone.
You own the code
Copy the stylesheet — and the script, icon sprite, and catalog when you need them — and they are yours: readable, token-driven, and yours to modify. No registry, no lock-in, no dependency tree you did not choose. Leaving should always be as easy as staying — that is what keeps a library honest.
A design system built for AI agents and the AI era.
Built with smartwebUI
Tell us what you build.
We’re showcasing below real projects using smartwebUI. SupportEngine is the first major project, and we’d love to see what you create next. Just contact us to be added to the list.
The practical difference
Design is how it works
A UI kit should make product decisions easier to repeat, adapt, and maintain.
-
Tokens carry the system
Theme, density, material, spacing, shape, and layer decisions stay connected through a shared token vocabulary, so a visual change travels across the interface instead of becoming a component-by-component override.
-
Patterns meet real product work
Complex forms, resilient data tables, app chrome, command navigation, charts, and media workflows are designed as part of one language—so the work after the marketing page does not become a patchwork of one-off UI.
-
Useful defaults leave room for your product
The library provides hierarchy, feedback, motion, and interaction details without prescribing your information architecture, state model, or server stack. It is a foundation to adapt, not an application to work around.
Choose your starting point
The design system is free. Go further when you need to.
Build with the complete smartwebUI foundation at no cost, then add production-ready blocks, the Figma library, or a powerful tool using it.
smartwebUI
Everything needed to build polished, accessible web interfaces without a framework.
FREEfor personal and commercial projects*
- 50 production component families
- Solid, Liquid, Minimal and Relief materials
- Light, dark, density, and theme tokens
- JavaScript and TypeScript support
- Web applications — including chat hosts and AI tools
Blocks library
RecommendedStart from complete application patterns instead of assembling every screen from scratch.
49 dollarsone-time purchase
- 45 copy-ready interface patterns
- Framework-neutral semantic HTML
- Responsive Solid, Liquid, Minimal and Relief materials
- Ready to adapt to your product
Figma library
Design production interfaces with the same naming, tokens, states, and responsive structure as the web library.
69 dollarsone-time purchase
- Component sets covering all 50 web families
- Light and dark local variables
- Auto layout and controlled variants
- Starter-plan-compatible .fig file
AppSyntax
Native app for Mac. Create live dashboards from databases (MySQL or MariaDB). Full website generated with export to host on any server.
99 dollarsone-time purchase
- Requires macOS 27
- Optimized for Apple Intelligence
- Create dashboards with the assistant
- Create automations with Shortcuts
* Web applications, including chat hosts and AI tools, run smartwebUI free. Embedding smartwebUI inside a distributed product — an Electron or desktop app, an SDK, or a rebranded build — is covered by a separate commercial embedding license.