<div align="center">
   <h1>Let's UI</h1>
   <p>
      **Let's UI** is an open-source design system built to be flexible, scalable, and easy to use.
      <br>
      It supports features **well-structured design tokens** and provides **interactive and accessible components**.
   </p>

[![release](https://img.shields.io/github/v/release/mateusvillain/lets-ui-css?logo=github&logoColor=white)](https://github.com/mateusvillain/lets-ui-css/releases)
![npm version](https://img.shields.io/badge/npm-v0.17.1-blue?logo=npm)
[![jsDelivr](https://img.shields.io/jsdelivr/npm/hm/@lets-ui/css)](https://www.jsdelivr.com/package/npm/@lets-ui/css)
[![Figma](https://img.shields.io/badge/figma-library-F24E1E?logo=figma&logoColor=white)](https://www.figma.com/community/file/1535276013550483080/lets-ui)
[![license](https://img.shields.io/npm/l/@lets-ui/css)](LICENSE)

</div>

## Technologies

Let's UI is a multi-brand design system built solely with a Sass/CSS structure and a JSON-based design token architecture.

Design tokens are maintained and scaled in JSON, using [Terrazzo](https://github.com/terrazzoapp/terrazzo) to generate the CSS custom properties file and the Sass variables map.

The design system includes a complete and compatible Figma library, enabling fast and agile interface creation, as well as the use of AI Agents for component creation and updates.

## Quick start

### Clone

```bash
git clone https://github.com/mateusvillain/lets-ui-css.git
cd lets-ui-css
npm install
```

### npm

```bash
npm install @lets-ui/css
```

## Import

```css
@import '@lets-ui/css/dist/letsui.min.css';
```

## CDN

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@lets-ui/css@latest/dist/letsui.min.css" />
</head>
<body>
</body>
</html>
```

## License

This project is licensed under the MIT License.
Feel free to use, modify, and contribute!
