0150 components
Marketing
Sections that sell. Heroes, features, pricing, social proof and calls to action.
- Hero
- Features
- Logo clouds
The UI kit for AI websites
Finished React and Tailwind components for every website you build with AI, light and dark, in your accent. Copy the code, or let Claude, Cursor or Copilot build the whole page over MCP.
- 350 components
- 1,630 variants
- 305 icons
An AI website UI kit for every assistant
An AI website comes together in a conversation, and it is only as good as the parts the assistant can reach for. This kit gives every assistant the same finished, checked components.
What the kit is
Components for React and Tailwind, from hero and pricing to dashboards, forms and AI chat. Each one ships as source you own, light and dark, in your accent, in English and German.Browse all components
Build with AI, keep the code
Your assistant installs a component with one tool call and writes your content into its props. The result is plain code in your Astro, Next.js or Vite project, readable and yours to change.Docs for AI assistants
Works with your assistant
The CLI is an MCP server. Claude, Cursor, GitHub Copilot, Windsurf, Codex and Gemini connect with one line of setup, and every command becomes a tool they use on their own.Set up your assistant
Everything a website is made of
350 components in 8 areas, from the first screen to the checkout.
0249 components
Content
Sections that tell and ask. Blog, long reads, team, about, docs, legal pages, contact and forms.
- Blog
- Gallery
- Team
038 components
Layout
Navbars, footers, page headers, sub navigation and app shells that hold a site together.
- Navbars
- Footers
- Sidebars
- Authentication
- Dashboards
- Tables
0520 components
E-Commerce
Products, product pages, reviews, cart, checkout, delivery and customer accounts.
- Products
- Categories and collections
- Product pages
0645 components
Industries
Ready sections for practices, restaurants, trades, hotels, schools, clubs and creators.
- Menus
- Appointments
- Listings
- Buttons
- Forms and inputs
- Pickers and selections
0827 components
Visuals
Mockups, campaign pictures, animations and graphics. Pictures for your pages, drawn in code and ready to use.
- Mockups
- Campaign mockups
- Animations
Pictures, drawn in code
Mockups, animations and graphics for your pages. They take your accent and stay sharp at every size.
Mockup scenes Desktop and phone
Globe Arcs
Maps and plans City maps
One accent. Every component follows.
Light and dark come from the same code. Shape a component in the Studio and copy it.
Describe it. Your AI assistant builds it.
Over MCP your assistant knows every component and every command. It picks, installs and checks, and the code lands in your Astro, Next.js or Vite project.
AI assistant · cafe-mira
›Build a landing page for Café Mira in Leipzig. Warm, calm, with opening hours and a booking form.
I will build it from kit components. First I look at what fits.
aiw_components contact
8 variants, location-map fits
aiw_add hero menu gallery testimonials contact footer
16 files written, dependencies resolved
aiw_theme --colors primary=#b45f3c
Accent set, contrast 4.8 : 1
aiw_check dist
0 errors at 390, 768 and 1440
Done. 6 sections, light and dark, checked on three widths.
$ npx -y ai-website mcpMCP serverMeet the CLI
UI Kit
The kit in numbers
- components
- 350
- variants
- 1,630
- categories
- 170
- icons
- 305
Collections by kind of website
CLI
One command line for the whole site
aiw takes a site from an empty folder to the upload. Every command runs in your terminal and, with aiw_ in front, as an MCP tool in Claude, Cursor, Copilot, Codex or Gemini.
- 1
Start
Check the machine, create the project, run the kit.
aiw new - 2
Find components
The whole catalog in the terminal, every variant with its install line.
aiw components - 3
Add
The installer of the kit. aiw add fetches the component from the kit registry, resolves its dependencies and writes the files.
aiw add - 4
Check
Code, pages, accessibility, links, speed and SEO. Measured, not guessed.
aiw check - 5
Publish
Search index, preview and upload. Always a dry run first.
aiw deploy
Questions and answers
Short answers to what people ask most when they start with the kit. Each one links to the page with the details.FAQ
Do I need Astro?
No. Components are React files with Tailwind 4. aiw new creates an Astro project, and the kit is also tested in Next.js and Vite.Installation
Does it work without Tailwind?
The components are built with Tailwind 4 and read their colors from the tokens in kit.css. Tailwind belongs in the project for that reason.Include kit.css
Do I need the CLI?
Not for Copy & Paste. The CLI resolves dependencies, records versions and connects your AI assistant, which saves a lot of handwork with several components.The aiw CLI
Do I need an AI assistant?
No. Every component works without AI. An assistant such as Claude, Cursor, GitHub Copilot or Codex is a fast way to build whole pages from components.Build with AI assistants
May I use the components in client projects?
Yes. The kit and the CLI are released under the MIT license. Use the components freely in your own projects and for clients, commercial ones included, the license notice stays with the code.Licenses
Is there a light mode?
Yes. Without a class everything is light, class="dark" on the html element switches to dark. The kit starts dark, both modes are designed with the same care.Dark mode as the default
Our vision
Better websites make a better web.
We build the parts for it.
Fast for everyone
Rendered on the server, readable without JavaScript, light on every connection.
Open to everyone
Real headings, keyboard and focus, contrast in light and dark, calm with reduced motion.
Yours for good
Plain source in your project, free for your own websites and for client work.
Versioned
Every component carries a version, every release is in the changelog, aiw outdated shows what changed.
Your next website starts here.
- Free for your own websites and client work
- English and German