Introduction
CellForge: loader motion that fits your brand
CellForge is a component library for branded loading states. Install from the shadcn registry or npm, tune a loader in Studio, then ship motion that stays lightweight and easy to maintain.
What this project is
CellForge supports two install models: pull editable source through the shadcn-style registry, or install the runtime package from npm. Studio adds a visual layer for picking motion, shape, spacing, color, and framework output before you copy.
Why it exists
- - focused loading components instead of a full design framework
- - open source code you own after installation
- - registry distribution for source ownership and npm distribution for runtime imports
- - primitives that adapt to your spacing, color, and motion tokens quickly
How it fits your stack
The setup works best in React apps already using Tailwind CSS with a shadcn-compatible `components.json`. In that environment, onboarding is short: add the registry, install a loader, and style it to match your product.
Studio vs Playground
Studio
Use Studio for final loader selection, brand tuning, preview frames, and copy-ready output.
Playground
Use Playground for fast experiments, extreme prop ranges, and checking how motion behaves.
Project links
Start here
Jump into Usage to install your first component, or review the loader gallery to preview available primitives.