Presentation of the collaborative flow between design and frontend in the development of an atomic design system for any project. On the design side, the work methodology will be explained, in Figma, and a project will be presented in the form of a template that could correspond to the component system to be used in the frontend development. The ease of replicating and adapting any project will be highlighted thanks to the definition of design tokens (foundations), patterns and components. On the frontend side, the process of interpreting the Figma template design and how it becomes a real design system based on web-components and tailwind will be explained. To highlight the collaborative process, it will be explained how the design is documented in Figma and the impact this has on the workflow between designers and developers, as well as the communication facilities involved.