Free React Dashboard - Purity Chakra UI
Tags: react, chakraui, dashboards, opensource
Published: 2021-09-08 06:31:30

Hello!
This article presents an open-source [React Dashboard](https://dev.to/sm0ke/react-dashboards-open-source-apps-1c7j) crafted by Creative-Tim on top of Chakra UI a pixel-perfect component library for **React**. **[Purity UI Dashboard](https://bit.ly/3BRvsa1)** can be downloaded directly from Github and used for unlimited hobby and commercial products based on the permissive (MIT) License. For newcomers, **React** is a leading JS library for coding user interfaces backed by Facebook.

*Thanks for reading!* - Content provided by **[Admin Dashboards](https://www.admin-dashboards.com/)**.

---

> **[Purity UI Dashboard](https://bit.ly/3BRvsa1) - product page** (contains DEMO and sources)

--- 

> *Disclosure* - **This post contains affiliate links**. 

If you use these links to buy something (no additional cost to you) I may earn a commission, product, or service. **Thank you!**

---

![Free React Dashboard Purity - Billing Page.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fu852ykkyekjnxrylvj6.png)

---

Designed for those who like modern UI elements and beautiful websites **Purity Dashboard** is made of hundreds of elements, designed blocks, and fully coded pages.
 
**Fully Coded Elements** - Purity UI Dashboard is built with over 70 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, or alerts, giving you the freedom of choosing and combining. All components can take variations in color, that you can easily modify using Chakra's style props.

**Example Pages** - If you want to get inspiration or just show something directly to your clients, you can jump-start your development with our pre-built example pages. You will be able to quickly set up the basic structure for your web project.

---

![Free React Dashboard Purity - User Profile Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pkrtx3kn9o8xf1pyodvz.png)

---

## Compile from Sources

Being an open-source product we can build this modern **React Dashboard** without leaving this page by typing a few commands in the terminal. Before you start make sure you have a [minimal programming kit](https://docs.appseed.us/content/tutorials/minimal-programming-kit) properly installed and accessible in the terminal.  

- A modern editor - VSCode or Atom
- Nodejs - used in Javascript-based products and tools
- Yarn - a popular package manager for NodeJS (better than NPM)
- GIT - a command-line tool used to download sources from Github

Once all tools are available we can move forward and compile the product using the build instructions provided by [Purity Dashboard](https://bit.ly/3BRvsa1) README.

---

> **Step #1** - Clone the sources from the public repository

```bash
$ git clone https://github.com/creativetimofficial/purity-ui-dashboard.git
$ cd purity-ui-dashboard
```

---

> **Step #2** - Install modules
 
```bash
$ npm install 
// OR
$ yarn
```

---

> **Step #3** - Start in development mode

```bash
$ npm run start
// OR
$ yarn start
```

---

![Free React Dashboard Purity - Login Page.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4q6jvmcnz7ozgxcw6tqt.png)
 
---

> **Thanks for reading!** For more resources please access:

- More [React Templates](https://bit.ly/37j8JG3) crafted by Creative-Tim
- Free [React Dashboards](https://dev.to/sm0ke/react-dashboards-open-source-apps-1c7j) - a curated list published on Dev.to