A methodology for scalable, reusable component systems.
Atomic Design is a methodology by Brad Frost that assembles interfaces step by step from small, reusable building blocks into larger structures. Atoms like buttons and input fields become molecules, those become organisms, then templates and finally concrete pages. The gain is not in the naming hierarchy itself but in the discipline of thinking the small parts through cleanly before pages exist. That way a component system grows consistently, instead of tipping into sprawl with every new view.
More in the documentationWe structure your components by exactly this principle, from the smallest element to the finished page, and mirror that in Figma as well as in code. That way everyone on the team finds the right building block at once and nobody accidentally builds the fifth slightly different button. Storybook makes these layers visible and testable, so your design system is documented rather than living only in people's heads.
Good to know
The five stages are a way of thinking, not a law. In practice it pays to hold the rigid hierarchy loosely and cut building blocks by actual reuse, rather than forcing every component into one of the drawers.
More tools we work with in the same area.
You don't have to decide that, it's our job. Tell us about your plans.