Align UI
React and Tailwind components with a paired Figma kit.
Align UI is built around a single promise stated in its own tagline: design and development perfectly aligned. Around 180 React and Tailwind components ship alongside a matching Figma library, maintained together.
At a glance
| Distribution | copy and paste from the docs |
| Components | ~180 |
| Styling | Tailwind CSS |
| Figma kit | yes, the design source of truth |
| MCP server | not published |
| License | MIT |
Who this is actually for
Most libraries in this directory are chosen by a developer working alone. Align UI is chosen by a pair: a designer who owns the Figma file and a developer who owns the code, who need those two artefacts to stay in sync without a weekly reconciliation meeting.
If you are a solo builder, that shared-source-of-truth benefit is worth very little to you and other kits will serve you better. If you are a small product team where design handoff is the actual bottleneck, it is the whole point.
Worth knowing
Accessibility is not documented. The components are visual definitions rather than behaviour definitions, so keyboard handling and ARIA semantics are your responsibility. Pairing them with a headless primitive layer is a sensible pattern.
Choose it if
- A designer and a developer need to work from one definition.
- You want a large, coherent visual system rather than assorted components.
Look elsewhere if
- Accessibility conformance is a requirement.
- You work alone. The Figma pairing is most of the value.