Headless Vue components for AI-native apps — conversations, tools, code blocks, voice, and workflows for Nuxt.
Overview
AI Elements Nuxt is a library of headless Vue components for building AI-native applications in Nuxt. It covers chat UIs, tool invocation, reasoning views, code blocks, terminals, voice, and workflow canvases.
Components are styled via data-ai-* hooks and work with any design system. It follows the AI SDK UIMessage.parts contract, so it can sit on top of any provider while staying Nuxt-native.
Install
Quick install
pnpm add ai-elements-nuxt ai @ai-sdk/vue
Then enable the module in nuxt.config.ts:
export default defineNuxtConfig({ modules: ['ai-elements-nuxt'], aiElements: { defaultStyles: true } })
Links