Installation
ng-blatui targets Angular 21 & 22 with Tailwind CSS v4. Three short steps and you're ready.
1. Install the packages
The library plus its headless peers (Angular Aria & the CDK).
npm i ng-blatui @angular/cdk @angular/aria2. Add Tailwind CSS v4
Install Tailwind and the PostCSS plugin…
npm i -D tailwindcss @tailwindcss/postcss…then create .postcssrc.json:
// .postcssrc.json
{
"plugins": { "@tailwindcss/postcss": {} }
}3. Import the design tokens
In your global src/styles.css — Tailwind, the ng-blatui tokens, and a @source so Tailwind generates the utility classes the components use.
/* src/styles.css */
@import 'tailwindcss';
@import 'ng-blatui/foundations/blatui.css';
/* let Tailwind generate the utilities ng-blatui renders */
@source '../node_modules/ng-blatui';4. Use a component
Import the standalone directive/component and use it in any template.
import { Component } from '@angular/core';
import { BuiButton } from 'ng-blatui';
@Component({
selector: 'app-demo',
imports: [BuiButton],
template: `<button buiButton>Click me</button>`,
})
export class Demo {}Next
See every component with live previews and copy-paste code on the Components page, or tune the look from the Customize button (bottom-right).