Introduction
moco is a copy-source library of editorial React components — built for technical essays and blogs, not dashboards.
Most component libraries are built for products: forms, tables, modals. moco is built for writing — scrollytelling stages, margin notes, inline sparklines, before/after compares, block diagrams, code walkthroughs. Things that make a long technical read feel considered.
Philosophy
- You own the code. There is no npm package to depend on. Every component is a
.tsx+.csspair that lands in your repo. Edit it, fork it, delete half of it — it is your code from the moment it arrives. - Editorial typography first. Components are designed to sit inside prose: sparklines align to the text baseline, notes live in the margin, numbers count up without shifting layout.
- The boring parts are done. ARIA roles, keyboard support, focus management, and
prefers-reduced-motionare handled inside every component. - Nothing to eject from. Plain React and plain CSS variables. No styling framework, no runtime dependency, no lock-in.
What’s in the box
20 registry items: interactive figures (compare, scrolly, stepper, zoom), inline elements (countup, scrub, spark, notes), structure and navigation (island, rail, palette), visual pieces (diagram, cover, dotgrid, figure, math, code), plus utilities (hooks, view-transitions) and the tokens theme contract that styles them all.
Three ways in
- Ask Claude. moco ships an MCP server — describe what you need and the component is installed for you.
- shadcn CLI. The registry is standard shadcn format —
npx shadcn addworks with every item. See Installation. - Copy-paste. Full source with copy buttons on every component page.