Installation
What Margo UI needs, and how to add it to a project.
Requirements
| requirement | |
|---|---|
react | ^19.0.0 |
react-dom | ^19.0.0 |
tailwindcss | ^4.0.0 |
node | >=18 |
Install
bash
npm install margo-uiStylesheet
Import the kit in your entry stylesheet. It brings in the base styles, the tokens, the dark: variant, the grid utilities and margo-text-box-trim.
css
/* your entry stylesheet */
@import "tailwindcss";
@import "margo-ui/fonts/nunito.css";
@import "margo-ui/fonts/bebas.css";
@import "margo-ui/css";Fonts
The kit uses Nunito for text and Bebas Neue for titles. Both are self-hosted woff2 files with font-display: swap, imported separately from the rest so you can leave them out.
css
@import "margo-ui/fonts/nunito.css";
@import "margo-ui/fonts/bebas.css";