Saltar al contenido
fluxr
Descargar tokensExportBrandbook

Descargar tokens

Los tres archivos se generan en cada build desde styles/tokens.css. Si el sitio cambia un valor, la descarga cambia con él.

Archivos

01
fluxr-tokens.css
Custom properties de los dos temas. Canales RGB separados, listos para <alpha-value>.

Descargar

fluxr-tokens.json
Los mismos tokens con hex resuelto — para herramientas de diseño y scripts.

Descargar

fluxr-tailwind.theme.js
Fragmento de tailwind.config: colores, familias, breakpoints y radios.

Descargar

Cómo usar

uso02

Importá el CSS antes de tu hoja de estilos y aplicá el fragmento de Tailwind. Los componentes shadcn se mapean en la página de tokens semánticos.

@import './fluxr-tokens.css'; .botao { background: rgb(var(--color-primary)); color: rgb(var(--color-on-primary)); box-shadow: 0 4px 16px rgb(var(--color-primary) / 0.25); }

Sistema

03
/* Manrope (corpo/UI) + Space Grotesk (display) + JetBrains Mono */ @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300..800&family=Space+Grotesk:wght@400..700&family=JetBrains+Mono:wght@400..700&display=swap');