Practical examples for lean, dependency-free product interfaces.
Use these examples to evaluate Batoi UIF across admin workspaces, RAD flows, charts, realtime interfaces, mobile shells, AI approval patterns, content pages, commerce flows, and full professional product surfaces.
Professional Showcase
A full product-grade shell with KPI dashboard, CRM pipeline, AI approval desk, mobile field console, RAD admin table, and statistical analytics.
Chart Gallery
Every supported SVG chart type, including statistical charts such as histogram, box plot, regression, control chart, and Pareto.
IconsIcon Gallery
Browse every built-in SVG icon with copy-ready declarative markup, JavaScript usage, and raw SVG output.
Client-onlyMicro App Dashboard
A one-page Micro App using only Batoi UIF dist files, local persistence, charts, import/export, undo, and redo.
Admin Workspace
Workspace shell, navigation, cards, tables, and repeated admin actions.
DashboardRAD Dashboard
Dashboard layout for server-rendered RAD applications with charts and workflow summaries.
CRUDRAD CRUD
Forms, tables, confirmation actions, and server-friendly partial update patterns.
AIAI-Assisted RAD
AI action UI patterns for guided, auditable application workflows.
ApprovalAI Tool Approval
MCP-style approval cards, risk display, and tool execution review surfaces.
RealtimeRealtime Ops
Operational monitoring pattern with live status, queue rows, and updates.
FeedRealtime Feed
SSE, WebSocket, and polling fallback patterns for server-friendly realtime views.
MobileMobile Shell
Mobile topbar, content region, bottom navigation, and safe-area conventions.
PWAMobile PWA
Install prompts, offline state, and mobile-first application structure.
CommerceCommerce Checkout
Checkout forms, summaries, validation-ready fields, and action controls.
SaaSSaaS Settings
Settings sections, form controls, plan details, and account configuration patterns.
ContentContent Site
Content-oriented layout using the same small CSS foundation.