components.json

The tiny config file the `add` CLI reads. It tells `add` where to put files, which style to use, and which tokens to expect.

The file Bloom ships

This is the components.json from the repo root. bloom-nx init writes the same fields into your project, minus style, and points css at your global stylesheet (src/app.css by default).

components.json

{
	"style": "nova",
	"tailwind": {
		"css": "src/routes/layout.css",
		"baseColor": "neutral"
	},
	"aliases": {
		"components": "$lib/components",
		"utils": "$lib/utils",
		"ui": "$lib/components/ui",
		"hooks": "$lib/hooks",
		"lib": "$lib"
	},
	"typescript": true,
	"registry": "https://bloom-nx.vercel.app/r"
}

style

"nova" is the current default style — modern radii, slightly softer shadows. Changing this after installing components doesn’t retroactively restyle them; it only affects new add runs.

tailwind

css — path to the stylesheet that imports tailwindcss and your token files. The CLI appends @source and animation imports here when needed. Bloom points this at src/routes/layout.css (the SvelteKit root stylesheet); bloom-nx init defaults it to src/app.css — set it to wherever your global stylesheet lives.
baseColor — "neutral" gives true-gray neutrals. Bloom overrides the brand hue (primary → purple) in theme.css but keeps the neutral scale so surfaces and borders stay honest.

aliases

Maps import prefixes to source folders. SvelteKit resolves $lib to src/lib, so every alias here nests under that. If you fork Bloom into a different stack, re-point these.

components → root for any non-ui code the CLI generates.
ui → where primitives land ($lib/components/ui/<name>).
utils → the cn helper and type utilities.
hooks → reserved for any Svelte action or store the CLI generates.
lib → the $lib root itself.

typescript

true — always. Bloom is a TS project end to end and the CLI generates .ts/.svelte with typed props.

registry

Where add pulls component source from — the bloom-nx registry at https://bloom-nx.vercel.app/r. Leave it alone unless you’re running a private registry.

When to edit

Rarely. The two fields worth changing are tailwind.baseColor (if you want a different neutral scale — e.g. "zinc" for a colder gray) and tailwind.css (if you reorganize stylesheets). Everything else is infrastructure.