MIT · v0.1 · dependency-free CSS

The design system for people who make things.

Videos, courses, build logs, trips — every shape a creator publishes, decided once in tokens and reused everywhere. Almost monochrome, so one colour can mean live.

Read the docs Browse components

No framework · no runtime · no build step required

Why it exists

Opinions, so you can stop having them

Token-first

Every value is a variable off a ladder. Change three and the whole site rebrands — site, player, thumbnails.

One rationed accent

Near-monochrome ink so a single colour can mean live. Attention is budgeted, not sprayed.

The platform first

<details>, <dialog>, the Popover API and native inputs. Keyboard and focus come free.

Honest motion

Under 200ms for feedback, one property at a time, and every animation off under reduced-motion.

Light and dark

Both themes from the same variables. Ink and paper flip; the record-red is the one hue that stays.

Site and channel

The same tokens export to YouTube thumbnails, banners and Instagram posts. One brand, not two.

Install

Three lines, any stack

Full guide →

It is a stylesheet. Use it with plain CSS, SCSS, Tailwind, Ghost, Astro or a single HTML file — then override three variables and it is yours.

bash

npm install creator-design-system

css

@import "creator-design-system";

Built with it

Showcase

All sites →

Swarnil Singhaiimswarnil.comThe site the system was built for — videos, courses, build logs and trips under one identity.

Start from a finished thing

Templates

All templates →

Ghost · $49Swarnil — Ghost themeThe full creator theme: videos, courses with syllabus, web series, projects with build logs, travel and docs.

Open source

Free forever. Sponsored keeps it maintained.

MIT-licensed and built in public. If it saved you a weekend, sponsorship pays for the next component — and templates fund the rest.

Sponsor the project Star on GitHub

Or contribute — issues and pull requests are genuinely welcome.