Design systems & Nx monorepos
One component library your whole product is built from.
The problem
When every team builds its own buttons, dialogs and tables, the product looks inconsistent and every UI change has to be made in many places.
A design system with tokens, tested components and Storybook docs, in a monorepo with clear boundaries, makes new features faster to build and easier to review.
What you get
- Design tokens for colour, type and spacing, aligned with your designers
- An accessible Angular component library, built on Angular Material or the CDK where that helps
- Storybook documentation your designers and developers both use
- An Nx monorepo setup with libraries, boundaries and affected-only CI
- A migration path from existing screens to the new components
How it works
Inventory
I catalogue the components and styles you already have and where they differ.
Foundation
Tokens, the monorepo structure and the first core components.
Adopt
Existing screens move to the library one area at a time.
Document
Storybook and contribution guidelines so the system keeps growing.
Related work
Questions
Should we build our own components or use Angular Material?
Usually both: Angular Material or the CDK for the complex behaviour (overlays, focus, accessibility), wrapped in your own components and tokens so the look stays yours.
Is Nx worth it for a single app?
Often yes, once the app has several feature areas or a second app is likely. Library boundaries and affected-only builds pay off quickly as the team grows.
Do you work with designers?
Yes. I work from Figma and set up tokens and Storybook so designers can check the implemented components directly.