Todos los colores y breakpoints utilizados en el proyecto! 🌈
| Tamaño | Nombre | Descripción |
|---|---|---|
| 480px | brand-md | Medida para modales |
| 730px | brand-lg | Medida para el contenido principal |
| Token | Nombre | Descripción/Caso de uso |
|---|---|---|
| #FFFFFF | brand-white | - |
| #7C5DFA | brand-violet | Background del botón primario |
| #9277FF | brand-violet-light | Background del botón primario en hover |
| #F9FAFE | brand-violet-ghost | Background del botón secundario |
| #DFE3FA | brand-violet-highlight | Background del botón secundario en hover |
| #7E88C3 | brand-violet-muted | Color de texto en el botón secundario |
| #EC5757 | brand-red | Background del botón delete |
| #FF9797 | brand-red-light | Background del botón delete en hover |
| #FF8F00 | brand-orange | Texto del Badge naranja |
| rgba(255, 143, 0, 0.0571) | brand-orange-ghost | Background del Badge naranja |
| #33D69F | brand-green | Texto del Badge verde |
| rgba(51, 214, 159, 0.0571) | brand-green-ghost | Background del Badge verde |
| #373B53 | brand-gray | Background del botón terciario y color de Badge gris |
| #1E2139 | brand-gray-dark | Background del botón terciario (hover/Dark Mode) |
| rgba(55, 59, 83, 0.0571) | brand-gray-ghost | Background de Badge gris |
| rgba(223, 227, 250, 0.0571) | brand-gray-light-ghost | Background de Badge gris en Dark mode |
| #494E6E | brand-gray-light | Color de Divider en Sidebar lateral |
| #252945 | brand-gray-muted | Borde de Inputs en Dark Mode. Background botón secundario en Dark Mode |
| #0C0E16 | brand-text | Color de texto base |
| #858BB2 | brand-text-light | Color de texto secundario |
| #888EB0 | brand-text-muted | Color de botón terciario |
| #F8F8FB | brand-bg | Background del sitio |
| #141625 | brand-bg-dark | Background del sitio en Dark Mode |
| rgba(0, 0, 0, 0.4984) | brand-dark-ghost | Background transparente en modales |