Installation

npm install margo-ui

The package ships as TypeScript source rather than a build. Your bundler compiles it — which it has to do anyway, since Tailwind scans those same files for the classes to generate. A precompiled bundle would only add a step and hide the source from the scanner.

Getting started

One stylesheet wires everything up. The kit's CSS brings the base layer, the design tokens, the theme bridge, the grid and the utilities; the two font files are separate imports, so a project that already serves its own typography can leave them out.

/* your entry stylesheet */
@import "tailwindcss";
@import "margo-ui/fonts/nunito.css";
@import "margo-ui/fonts/bebas.css";
@import "margo-ui/css";

Order matters: tailwindcss first, the kit after, your own overrides last. Everything margo defines is a plain custom property, so the last declaration wins without any specificity war.

Fonts

The two typefaces are imported separately from the rest, so a project that already serves its own typography can leave them out and repoint the two family variables instead.

@import "margo-ui/fonts/nunito.css";
@import "margo-ui/fonts/bebas.css";