divriots/starter-origami

A react-native-paper based design system as a starter kit for Backlight

starter-origami

Origami is a React-Native Design System starter kit, using Paper component library: an open source components library based on Material Design.

Features

• Open-source
• Cross-platform: Mobile & Web
• 25+ components
• Interactive documentation
• Light & Dark mode

Design Tokens

Origami takes the design tokens defined in Paper.

• Colors
• Fonts
• Roundness
• Animation

And make them automatically documented and visually discoverable.

Paper has great semantical design tokens. It's simple but very efficient. The Paper team has done a great job here.

Dark mode

Dark and Light themes are included out-of-the-box. You can experience it in the documentation itself.

Components

Origami comes with 25+ components to get started: menu, dialog, buttons, checkbox, cards, everything to cover the basics, and more.

📦 npm package to try Origami unchanged.

Getting started

• Duplicate this starter-kit on Backlight.dev using the Duplicate button.
• Setup the design tokens to match your brand.
• Release the package to npm.
• Enjoy your Design System on your app(s) by importing from npm.

For more information, follow the Quick Starting Guide.