Pattern Lab
Pattern Lab is an open-source tool for creating UI design systems, providing
starter kits for projects with blank, sample, or demo components.
Some of our customers
_0.png)
Implement Atomic Design Systems
Pattern Lab is an open-source tool for building UI design systems. Its approach is based on the Atomic Design methodology, which separates a website into five basic patterns: atoms, molecules, organisms, templates, and pages. Offering pattern starter kits, start your Pattern Lab project with a blank slate, a few sample components, or a full demo project.
This is what defines us
OUTSOURCING PROJECTS DELIVERED
.webp)
PROFESSIONALS
.webp)
CLIENTS
.webp)
PROJECTS DELIVERED
Main features
- Create live UI prototypes using dynamic data to ensure your components can handle the dynamic nature of your content.
- Pattern Lab does not impose any tools or libraries on you, which means that you have full control over how to create your project.
- Define and describe your UI patterns so your entire team can start speaking the same language.
- Pattern Lab supports the Handlebars and Twig template engines. You can also create a plugin to further extend the capabilities of Pattern Lab.
Our Selection Process
Extensible
Choose your templating engine to match your production environment better. Also, you can or build a plugin to extend Pattern Lab's capabilities even further.
Nested patterns
Pattern Lab lets you include UI patterns inside each other like Russian nesting dolls. Make a change to a pattern, and see those changes reflected anywhere the pattern is included.
Pattern starter kits
Spin up Pattern Lab loaded with frameworks like Bootstrap, Foundation, or Material Design. But also start from scratch and build your custom design system.
Versatile
Pattern Lab can be used for simple rapid prototyping or for developing production-level frontend code. Some teams have even modified it to power their live sites.