rumbo.
design system · v1.1

un solo lenguaje,
sin perder el rumbo.

Tokens, componentes y documentación construidos sobre el manual de marca. Esta portada está hecha con el propio sistema — nada más que dist/.

—Tokens
18Componentes
—Íconos
2Temas

01 · Superficies

Design System

Foundations, 18 componentes con playground y código, patrones y pantallas. 35 vistas.

Abrir

Brand Manual

Propósito, voz y tono, logo, color, tipografía y aplicaciones. 15 capítulos.

Abrir

Kitchen sink

Todos los componentes usando solo dist/. Si algo se ve bien aquí, la librería es autosuficiente.

Abrir

02 · Consumir el sistema

<link rel="stylesheet" href="dist/fonts.css">
<link rel="stylesheet" href="dist/rumbo.css">    tokens
<link rel="stylesheet" href="dist/rumbo-ui.css"> componentes
<script src="dist/rumbo-ui.js"></script>

Con Tailwind: presets: [require('./dist/tailwind.preset.js')]. Detalles en README.md.

03 · Trabajar en el sistema

npm run dev     este servidor
npm run build   regenera dist/ desde tokens/ y assets/
npm run check   audita manual ↔ tokens
  • La fuente de verdad es tokens/tokens.json: nunca edites dist/.
  • Si cambias algo y no lo ves, recarga con Cmd+Shift+R (Chrome cachea los scripts).
  • Decisiones de marca en docs/decisions/.