Documentation

Angular AI Kit Documentation

A modern, signal-based component library for building AI chat interfaces in Angular v21. Built with Tailwind CSS v4, TypeScript strict mode, and full SSR/hydration support.

Quick Start

Get started with Angular AI Kit in minutes

Installation

1npm install @angular-ai-kit/core @angular-ai-kit/tokens @angular-ai-kit/utils

Your First Component

1import { ChatInputComponent } from '@angular-ai-kit/core';2 3@Component({4  selector: 'app-chat',5  imports: [ChatInputComponent],6  template: `7    <ai-chat-input8      placeholder="Send a message..."9      (messageSubmit)="handleMessage($event)"10    />11  `,12})13export class ChatComponent {14  handleMessage(content: string) {15    console.log('Message:', content);16  }17}

Or Use the CLI (Shadcn-style)

1# Initialize Angular AI Kit in your project2npx @angular-ai-kit/cli init3 4# Add components to your project5npx @angular-ai-kit/cli add ai-response chat-input

Explore Documentation

Find what you need

Features

Everything you need for AI chat interfaces

Angular v21

Latest features with signals, control flow, and zoneless support

Tailwind CSS v4

Modern utility-first styling with CSS-only

Spartan UI

Built on Spartan UI primitives (uses Angular CDK internally for accessibility)

Accessible

WCAG AA compliant with keyboard navigation and screen reader support

Dark Mode

Built-in theme support with CSS custom properties

TypeScript

Fully typed with strict mode enabled

SSR Compatible

Server-side rendering and hydration ready

Popular Topics

Frequently accessed pages

Ready to get started?

Explore our components, follow the guides, and build amazing AI chat experiences.