Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1,322 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Image

A CLI toolbox for creating design systems in minutes

Uses: Typescript, CSS, styled-components support

Outputs: CJS and MJS

No tooling configuration required

CircleCI npm npm Image Auto Release

Overview

Design-systems-cli is basically a Create React App for design systems.

The main benefit it brings you as a developer is time savings. Setting up all of the monorepo, storybook, and build tools for a design system takes over a week if you piece it together yourself. You can do it with this project in minutes.

Features

⭐ Scaffold components and entire design systems

⭐ Build your components for multiple outputs (cjs and esm)

⭐ Write styles with styled-components or css-modules

⭐ Craft excellent components using Storybook

⭐ Let component consumer try your components with playroom

⭐ Testing and linting support

⭐ Typescript supported out of the box

⭐ Track the size of your components and debug the changes

For the full documentation, go here.

Installation

Ensure you have the following softwares installed:

If node-gyp throws errors during installation, installation may still be successful

To get started:

To get set up, fork and clone the project then run the following command:

yarn && yarn start

Creating a new Plugin

To scaffold a new plugin inside this repo run the following command:

yarn run create:plugin "my plugin"

Contributing

Feel free to open an issue or a pull request!

Make sure to read our code of conduct.

We actively welcome pull requests. Learn how to contribute.

Contributors ✨

Thank you to all these wonderful people (emoji key):

Image
Adam Dierkens

💻 🎨 🤔 📖 ⚠️
Image
Andrew Lisowski

💻 🎨 📖 🤔 🚇 ⚠️
Image
Tyler Krupicka

💻 📖 ⚠️
Image
Kendall Gassner

💻 📖 ⚠️
Image
Kelly Harrop

🎨
Image
Peter Mikitsh

📖
Image
WhiteSource Renovate

💻 ⚠️
Image
mishavp2001

💻
Image
Raj Vasikarla

💻 📖 ⚠️
Image
Brandon Orther

📖 💻
Image
alan-cruz2

💻
Image
hainessss

💻
Image
Athitya Kumar

💻
Image
Jason Rundell (he/him)

📖 ⚠️ 💻
Image
Reuben

📖
Image
my99N

📖 ⚠️ 💻
Image
anjaliguptaz

📖
Image
chaopan

⚠️
Image
Talor Anderson

💻 📖 ⚠️
Image
Spencer Hamm

💻 📖 ⚠️
Image
Adil Malik

⚠️
Image
Salil Cuncoliencar

📖 ⚠️ 💻
Image
Gaurav Kesarwani

📖 ⚠️ 💻
Image
Nicolas Hoizey

📖
Image
Harris Borawski

💻
Image
Sean Powell

💻
Image
melindali255

📖 ⚠️ 💻
Image
Yucho Ho

💻
Image
Jeremiah Zucker

⚠️
Image
Abd El-Ghazali

📖 💻

This project follows the all-contributors specification. Contributions of any kind welcome!

Releases

Packages

Used by

Contributors

Languages