📚 About

📌 Project Developed during Ignite Lab 3 on Design System with Figma, Storybook and Radix.

Where the entire design of the project is done by a design system, starting with the layout developed in Figma and then all the component documentation is created with Storybook.

📦 Features

• Figma Design layout with style guide
• Responsive Login Page
• Storybook with all components documented
• Theme Switcher
• Selected theme saved on local storage
• React components composition

🛠 Tech Stack

• HTML5
• CSS3
• React
• Typescript
• Tailwindcss
• Storybook
• Radix ui
• Figma

🎨 Figma Design

The project design in figma with the style guide can be found here.

 

🗃 Design System

All components are documented in the Storybook.

🚀 Getting Started

These instructions will get you a copy of the full project up and running on your local machine for development and testing purposes.

The project can be built with npm or yarn, so choose one of the approach bellow in case you don't have any installed on your system.

• Node.js
• Yarn
• Git

⚙️ Setting up

# Clone this repository
$ git clone https://github.com/ElisonMichell/lab-design-system.git

# Go into the repository
$ cd lab-design-system

# Install dependencies
$ npm install

# start the application
$ npm run dev

# Now you have a copy of the project to modify and test in your editor.

📝 License

This project is under the MIT license. See the LICENSE for more information.

Made with ♥ by Elison Michell 👋 Get in touch!