Usage

What `add` does

1. Fetches the component's metadata and file contents from the registry (free components come back inline; paid ones need a stored licence key).
2. Writes each file to your project under --dest (default src).
3. Records the slug, version, and a content hash of what it wrote into velocityx.lock.json in your project root.
4. Never overwrites a file that already exists unless you pass --force — see do updates overwrite my edits? in the FAQ.

That's it. No build step reaches back out to Aidxn, no component ships a hidden fetch to an Aidxn endpoint, and nothing in your bundle phones home. The handful of components with an analytics hook (an NPS prompt, a cookie consent banner) take a plain onSubmit / onAccept callback prop — you wire it to your own analytics, or don't.

The theme contract

Components are written against Tailwind's primary and accent colour scales — never a hardcoded hex, never an inline style for colour. Those scales resolve through CSS variables (--vx-primary-600 and friends) defined once in velocity-theme.css, which velocityx theme installs.

41 variables cover the whole library: an 11-stop primary ramp, an 11-stop accent ramp, an 11-stop neutral ramp (used for text, borders and muted surfaces), 5 semantic surface tokens (background, raised surface, text, muted text, hairline — light and dark), and 3 shape/type tokens (radius, large radius, font). Override the handful you actually use — 600 and 700 cover most of a single-brand swap — and every component that uses that scale re-themes. No component file needs touching.

:root {
  --vx-primary-600: 220 38 38;  /* #DC2626 — raw RGB channels, not hex */
  --vx-primary-700: 185 28 28;  /* #B91C1C */
}

One format rule that trips people up: raw RGB channels, space separated — 79 70 229, not #4F46E5 and not rgb(79 70 229). Tailwind composes these as rgb(var(--vx-primary-600) / 0.2) so that opacity modifiers like bg-primary-600/20 work — a hex value there fails silently, no console error, the colour just doesn't render.