Skip to main content

Molecules

In Atomic Design, a "molecule" is a group of UI elements that function together as a unit. The "02-molecules" folder is a directory that is typically used to store the files for the molecule elements in a project that follows the Atomic Design methodology.

The purpose of the "02-molecules" folder is to store the TWIG, CSS, and JavaScript code for the molecule elements that make up the design system for a website or application. These elements could include things like "cards", "accordions", and small groups of layout elements that are used to build larger user interface components.

The "02-molecules" folder is typically organized in a way that reflects the structure of the molecule elements it contains. For example, if the project has a molecule element called "navigation", there might be a folder within the "02-molecules" folder called "navigation" that contains all of the code for that element.