Angular 21 · WCAG 2.1 AA

Accessible components, themed by tokens.

RhombusKit is a standalone, signal-based component library over Angular Material — styled through a frozen design-token contract. Light, dark, and your own themes, with contrast checked in CI.

Browse components

Theming guide

Flip the theme — the whole page re-themes from one token contract.

Built for a credible 1.0

Not just components — a promise: a frozen public surface, a token contract, and accessibility you can verify.

Token-driven theming

One semantic token contract drives every component. Switch data-theme — light, dark, or your own — and the whole UI follows.

WCAG 2.1 AA, verified

Every component is scanned by axe in CI, and colour contrast is verified in both light and dark themes against the real rendered output.

Angular-native

100% standalone, signal inputs, OnPush. Thin wrappers over Angular Material — no NgModules, no ceremony.

A 1.0 promise

The public exports, token names, and theming contract are snapshot-guarded in CI. Semver means something here.

Up and running in minutes

Install the packages, load the tokens + Material bridge, and import the standalone components you need.

Read the theming guide

…or skip setup entirely:

pnpm add @rhombuskit/core @rhombuskit/material-preset

// styles.scss — order matters
@use '@rhombuskit/tokens/scss' as tokens;
@use '@rhombuskit/material-preset/scss' as preset;
@use '@rhombuskit/core/scss' as core;

Explore the kit

Every component has a live page with Overview, an auto-generated API reference, and copy-ready examples.

Accessible components, themed by tokens.

Built for a credible 1.0

Token-driven theming

WCAG 2.1 AA, verified

Angular-native

A 1.0 promise

Up and running in minutes

Explore the kit

Primitives

Forms

Data & overlays

Navigation

Status & layout

Content