TailNG logo TailNG Docs

Principles

How TailNG is designed

A design system should enable teams, not constrain them.

1) Tokens over colors

Templates should not hard-code brand colors. TailNG promotes semantic tokens (bg, fg, border, primary, etc.) so themes can evolve without refactoring UI markup.

2) Tailwind-first composition

Tailwind remains the source of truth for layout, spacing, and typography. Components avoid hidden layout rules. You compose UI with utilities + small primitives.

3) Angular-first implementation

Standalone components and signal inputs by default. No legacy module patterns. Minimal runtime work, good tree-shaking, and predictable usage.

4) No lock-in

TailNG is just Angular components + Tailwind utilities + CSS variables. You can adopt gradually and exit cleanly.