Getting Started
Build loud.Stay sharp.
@ng-brutalism/ui gives modern Angular apps a token-driven component system with directive-first APIs, keyboard-ready interactions, hard-edged visuals, and Tailwind v4 ergonomics from the first import.
Why it stands out
Angular first
Built as Angular primitives with directive APIs, signal-friendly internals, and native interaction patterns that fit modern Angular apps.
Loud by default
Chunky borders, offset shadows, punchy color, and compact motion make interfaces feel instantly brutalist.
Easy to bend
CSS custom properties and Tailwind utilities keep theme overrides local, visible, and predictable.
Quick start
Install the package, import the stylesheet once, then pull each primitive into the Angular component that actually uses it.
import { Component } from '@angular/core';
import { NbButton } from '@ng-brutalism/ui';
@Component({
selector: 'app-ship-button',
imports: [NbButton],
template: `
<button nbButton type="button">
Ship the thing
</button>
`,
})
export class ShipButton {}Start exploring
Jump straight into the pieces that shape the most visible moments: setup, layout, overlays, actions, and forms.
Utility included
nbClass is exported from @ng-brutalism/ui and merges conditional class arrays with clsx plus tailwind-merge. Use it in your own components when you want the same conditional styling ergonomics the library uses internally.