How to use this kit

This kit is meant to be customised further. It’s the start of your own system. Just like shadcn/ui, this is not a component library. It’s how you start building your component library.

Summary

The tl;dr of using our kit:

1. Customise the thumbnail to your liking. Give it the name of your design system.
2. Customize the theme to your brand. You can use the 8 variable collections (shadcn colors, neutrals, chart colors, alpha, typography, border radii, spacing, and shadows) to theme the kit to your liking.
3. Publish the library to your Figma account (this requires at least a professional account).
4. Then, consume the library from another file. You can use the bookmark icon in the assets panel to find the controls to do so.

For more detail on each part of the kit, see:

• Colors
• Typography
• Icons
• Components
• Productivity plugins
• Technical comments
• Upgrading

Comments? Issues with this kit?

E-mail us at [email protected]. We welcome any feedback.

About Obra Studio

Obra Studio is a boutique design & development studio with roots in Belgium and Mexico. Check out our work and services.