Get Started

Paste one prompt into your agent and you're set up. Then pick where to go next.

UI SDK is a library of behaviors, like popups, lists and typeahead, that your agent puts together into components. It works with React, Vue, Svelte, Solid and Web Components.

New here? The Introduction shows how it all works.

Quick Start

Pick your framework, then copy this prompt into your agent.

Prompt

Set up ui-sdk in this React project. It needs React 19 or newer.

1. Install @ui-sdk/react and @ui-sdk/core with the project's package manager.
2. Add a note to AGENTS.md, creating it if needed: before using ui-sdk, follow the ui-sdk skill if it's installed, and read node_modules/@ui-sdk/react/docs/llms.txt. To build a new component, also search node_modules/@ui-sdk/react/docs/core.md by heading, and read rendering.md next to it.
3. If you support skills, run: npx skills add vercel-labs/ui --skill ui-sdk

Then ask your agent to build a component:

Prompt

Build a search field with ui-sdk: a text input and a Clear button that only shows when there's text. Clear empties the input and puts focus back in it. Use our existing styles.

Find a Component

SelectChoose one value or several from a popup list.FieldConnect a form control to its label, description, and validation errors.TabsSwitch between related panels with one tab selected at a time.ComboboxSearch a list of options and choose one or several values.Date PickerType a date or choose one from a calendar, with support for ranges and forms.MenuChoose actions and settings from a button or a context menu.

Or see all components.

Build Your Own

CoreThe behaviors, and how they fit together.Build a ComponentBuild a toggle button, then render it in your framework.BehaviorsFocus, selection, popups and the other pieces your components are made of.Compose BehaviorsBuild a star rating with shared state and keyboard navigation.

Work with Agents

Build with an AgentGive an agent the right context, build a small version, and check how it behaves.SkillsHelp your agent build custom components with @ui-sdk/core.Connect an AgentLet an agent read your components and call their actions.WebMCPLet the agent built into a browser read and use your components.

See what's new in the changelog.