Skip to content
Marketplace

Prototype Design · Design system

Corag UI Kit

El sistema de diseño de Corag 3.0: tokens, componentes y patrones de la app móvil, con el catálogo de las 64 pantallas de referencia.

A flagship prototype: complete and ready to try.

At a glance · shown in its phone shell

Live preview

393×852
Live demo bundled static build Open

No live preview yet.

Each prototype stores its data in IndexedDB for the address it runs on. Data you create at localhost:5173 is separate from a build at localhost:4173 or a published URL, and the framed preview shares storage with that address opened directly.

Highlights

  • Tokens oficiales de Corag (vino #78020E) en claro y oscuro
  • 49 componentes y 7 patrones con demos en vivo
  • Las 64 pantallas de referencia de Pencil y revisión de diseño persistente

Scenarios 3

  • kit-nuevo
  • kit-en-revision default
  • lectora

Each scenario rebuilds a deterministic world. Open one with ?scenario=<id>.

Spec kit

Every prototype carries a spec any agent can follow to rebuild it in a real app: the files below, in prototypes/corag-ui-kit/, with generated regions kept in sync with the code.

  • AGENTS.md
  • docs/SPEC.md
  • docs/DATA_MODEL.md
  • docs/FLOWS.md
  • docs/SCREENS.md
  • docs/PERMISSIONS.md

Check that the spec is current

pnpm protoyard spec corag-ui-kit --check

Rebuild kit (ZIP)

pnpm protoyard spec corag-ui-kit --bundle