![](data:image/svg+xml,<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<g filter="url(%23filter0_d_40_365)">%0A<path fill-rule="evenodd" clip-rule="evenodd" d="M84.1001 48.5601V173.06L110.8 146.56L136.3 207.56L158.3 197.06L133.8 139.06H172.8L84.1001 48.5601Z" fill="%23000000"/>%0A<path d="M88.0281 44.7102L78.6001 35.0909V48.5601V173.06V186.268L87.9746 176.964L108.876 156.218L131.225 209.681L133.454 215.013L138.669 212.524L160.669 202.024L165.411 199.76L163.366 194.92L142.094 144.56H172.8H185.892L176.728 135.21L88.0281 44.7102Z" stroke="%23FFFFFF" stroke-width="11"/>%0A</g>%0A<defs>%0A<filter id="filter0_d_40_365" x="55.1001" y="13.6218" width="155.883" height="230.843" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">%0A<feFlood flood-opacity="0" result="BackgroundImageFix"/>%0A<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>%0A<feOffset dx="-3" dy="7"/>%0A<feGaussianBlur stdDeviation="7.5"/>%0A<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.3 0"/>%0A<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_40_365"/>%0A<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_40_365" result="shape"/>%0A</filter>%0A</defs>%0A</svg>%0A)
Better than raw text
Let the model show actions, forms, and next steps instead of long instructions inside the conversation.
UI language for AI interfaces
Give your AI a language for building interfaces inside chat.
ToonUI lets an LLM respond with forms, buttons, choices, confirmations, and structured UI blocks so users can understand what to do next and provide data more easily.
Your app renders the UI and keeps control of actions, APIs, validation, permissions, and business rules.
Better data collection
Ask for structured input in chat without sending users to a separate page or breaking the flow.
Clearer user decisions
Present choices, confirmations, and recommendations in a way that is easier to understand and act on.
Real UI, predictable output
The model writes ToonUI. Your product renders it with real components that match your interface and rules.
The AI writes ToonUI. Your product renders the interface.
Write interface intent once, then turn it into real UI inside your product.
Instead of inventing React or vague JSON, the model returns ToonUI. Your renderer transforms that response into real UI that matches your product and interaction rules.
ToonUI code
alert success "Product deleted": text "Candy was deleted successfully."card "Recommended actions": text "Choose what you want to do next." button primary "Create product" reply="start-create-product" button secondary "View inventory" reply="show-products-again"Rendered UI
Product deleted
Candy was deleted successfully.
Recommended actions
Choose what you want to do next.
Less UI overhead for the model
ToonUI gives the model less to write and less to think about.
With ToonUI, the model focuses on interface intent. It does not need to spend as much output on JSON nesting, component trees, props, or implementation details. In the example above, ToonUI is materially shorter than the equivalent JSON UI and React UI representations.
Format
What the model has to think about
Words
Chars
Takeaway
ToonUI
Describe interface intent with a small, chat-first language.
30
270
Smallest surface area in this example.
JSON UI
Think about structure, nesting, keys, arrays, and renderer conventions.
82
908
About 63% more words and 70% more characters than ToonUI in this example.
React UI
Think about components, props, handlers, layout, and implementation details.
45
592
About 33% more words and 54% more characters than ToonUI in this example.
Comparison based on the same sample UI expressed three ways: ToonUI, a JSON UI schema, and React component markup. Savings vary by renderer and prompt, but the pattern is consistent: ToonUI removes structural noise so the model can focus on the interaction itself.
What ToonUI helps AI do better
Give AI a better way to guide users and collect information inside the conversation.
ToonUI helps AI move beyond plain text by turning model intent into usable interface blocks your product can render, validate, and handle safely.
Guide users with clear next steps
Collect structured data inside chat
Show confirmations before important actions
Turn model output into usable interface blocks
Render UI from model intent instead of fragile generated code
Make conversational flows feel like part of the product