Create beautiful, clear design systems
From a simple component library through to detailed descriptions of your styles, lucid makes it easy.
Designers, use lucid to:describe the details behind the design
Lucid is a tool for creating, managing and sharing design systems. From a simple component library through to detailed descriptions of your styles.
Developers, rely on lucid as:the single source of truth
Lucid gives you all the design styles in one place. So you don’t need to go hunting through layers in a file, or risk coding a component from the wrong design.
PRODUCT TEAMS USE LUCID TO:STAY RELEVANT, UP TO DATE AND IN SYNC
Changed a style? Added a new component? No problem. Jump into Lucid and update it. No need to ask the developers on your team to update it (they’ve probably got better things to do).
There’s no custom website to code, no need to worry about where to host it, and no need to spend time thinking about how it should work. So you can get back to creating great products.
A MODERN APPROACH FOR COLLABORATIVE TEAMS
Changed a style? Added a new component? No problem. Jump into Lucid and update it. No need to ask the developers on your team to update it.
The old way
Out of date style guides
Difficult to maintain
Effort to design and build
The new way
Beautiful, clear design systems
Easy to update and share
No need to build or host
Features designed to make your life easier
Principles
Let people know why you created your design system and why they should use it.
Style
Describe colors, fonts and icons and present them clearly.
Images
Provide guidelines for your photography, illustration styles and logos.
Writing guidelines
Set the tone, explain what to say and how to say it.
Components & examples
Describe components in detail to help developers. Show examples to inspire designers.
Do's and dont's
Guide people on what to do, and what not to do.
Code snippets
Add code so developers can hit the ground running.
Resources
Add your design files and links to things like your Zeplin or Figma projects.
Customisation
Choose colors for your header and links. Add your logo and a header image.
Plans and pricing
Free
3 projects that you can publish for 30 days
Early adopter price!
Designer
3 projects that you can publish and share forever
Professional
Unlimited projects!
New pro features coming soon
TAKE A CLOSER LOOK AT LUCID WITH OUR EXAMPLE DESIGN SYSTEM
‘Crema’ is a small demo design system created with Lucid so you can see the kind of output you can create quickly and easily.
See demo