# Show HN: Chai-UI – A design system to generative AI apps

> Source: <https://chai-ui.com/>
> Published: 2026-10-20 00:06:14+00:00

Version 0.10.0
4 Components
140 Tokens
4 Packages

``` js
// A prompt bar for your AI app
import { useState } from "react";
import { Composer } from "@chai-ui/react";
import "@chai-ui/tokens/css";
import "@chai-ui/react/style.css";

export function PromptBar() {
  const [prompt, setPrompt] = useState("");
  return <Composer value={prompt} onChange={setPrompt} onSubmit={console.log} />;
}
php
<!-- A prompt bar for your AI app -->
<script setup lang="ts">
import { ref } from "vue";
import { Composer } from "@chai-ui/vue";
import "@chai-ui/tokens/css";
import "@chai-ui/vue/style.css";

const prompt = ref("");
</script>

<template>
  <Composer v-model="prompt" @submit="console.log" />
</template>
```

**Copy & Paste to get a feel for it!** A working prompt bar with

`@chai-ui/react``@chai-ui/vue`.
                `onSubmit``@submit` hands you everything it tracks.
            The same UIs built into today's most powerful AI apps are now open source. With
            Chai UI, every AI model is controlled from one place, through one interface.
            Designers, developers and AI agents get components for **model routing**,
            **prompt optimization**, **media analysis** and
            **image editing**, plus new use cases like **world models**
            as they arrive.