v1.0 — Free & open source

Your brand config.
Production components.
No build pipeline.

Define your brand once. Get a CSS file, a component browser, and copy-ready HTML you can drop into any project — no build pipeline required.

emily.config.json
{
  "name": "My Brand",
  "colours": {
    "primary":   "#DB2777",
    "secondary": "#2563EB",
    "success":   "#059669"
  }
}

One config file. Your brand. Ready to ship.

Works withStatic HTMLDrupalVue / NuxtPower PagesAny CMS

Config in. Components out.

Three steps from a blank project to a branded design system.

1

Define your brand

Run the setup wizard or edit emily.config.json directly. Set your colours, fonts, and spacing scale.

npx emilyui init
2

Generate your CSS

Emily builds utility classes scoped to your brand config. No Tailwind setup, no PostCSS.

npx emilyui build
3

Copy components

Open the component browser, find what you need, paste the HTML into your project. Done.

Built for real-world teams

Not an ideal greenfield project. Not a startup with a fresh Figma file and a webpack config. Your messy, existing project.

No build pipeline required

Link the CSS file and go. Works in Drupal, Power Pages, static HTML — anything that accepts a stylesheet.

Accessibility by default

WCAG 2.2 AA built into every component. Focus rings, contrast ratios, reduced motion. Not an afterthought.

🎨

Automatic colour scales

Give Emily one hex value. It generates a full 10-shade OKLCH scale — perceptually balanced, contrast-aware.

📦

97% smaller in production

The purge system scans your templates and strips every class you don't use. 1.1 MB → ~30 KB typical.

🔧

Config-driven everything

Colours, spacing, typography, shadows, transitions — all from one JSON file. No hardcoded values in the output.

🧩

Copy-paste components

Eight production-ready components. Paste HTML into your project. No npm install, no imports, no runtime.

Components ready to copy

8 production components. Accessible, responsive, themed to your brand. Paste the HTML into your project and you're done.

Live preview — styled with Emily

Buttons

Alerts

Changes saved

Your config has been updated.

Form input

We'll never share your email.

Card

Design token ready

All colours live as CSS custom properties.

Ready to ship a design system this week?

Free to use. MIT licence. No sign-up required.