File: troubleshooting.md | Updated: 11/15/2025
Slash Forward
Docs Cookbook Providers Playground AI ElementsAI ElementsLeft sparkleRight sparkle AI GatewayGateway
Search...âKFeedback GitHub Vercel LogoSign in with Vercel
What to do if you run into issues with AI Elements.
Why are my components not styled?
Make sure your project is configured correctly for shadcn/ui in Tailwind 4 - this means having a globals.css file that imports Tailwind and includes the shadcn/ui base styles.
I ran the AI Elements CLI but nothing was added to my project
Double-check that:
package.json lives).Terminal
npx ai-elements@latest
If all else fails, feel free to open an issue on GitHub .
Theme switching doesnât work â my app stays in light mode
Ensure your app is using the same data-theme system that shadcn/ui and AI Elements expect. The default implementation toggles a data-theme attribute on the <html> element. Make sure your tailwind.config.js is using class or data- selectors accordingly:
The component imports fail with âmodule not foundâ
Check the file exists. If it does, make sure your tsconfig.json has a proper paths alias for @/ i.e.
tsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["./*"]
}
}
}
My AI coding assistant can't access AI Elements components
If none of these answers help, open an issue on GitHub and someone will be happy to assist.
Usage
Learn how to use AI Elements components in your application.
MCP Server
AI Elements supports the Model Context Protocol (MCP) for model-driven development.
On this page
Why are my components not styled? I ran the AI Elements CLI but nothing was added to my project Theme switching doesnât work â my app stays in light mode The component imports fail with âmodule not foundâ My AI coding assistant can't access AI Elements components Still stuck?
GitHubEdit this page on GitHub Scroll to topCopy pageOpen in chat