theming

chrome is dark-only by design — there is no light theme and the components assume a black page. what is configurable are the tokens. init writes a fenced block into your globals.css (it also loads poppins via a @font-face rule, trimmed here):

/* @chrome:theme */
@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-surface: var(--surface);
  --color-surface-alt: var(--surface-alt);
  --color-border: var(--border);
  --color-muted: var(--muted);
  --color-accent: var(--accent);
  --font-sans: "Poppins", sans-serif;
}

:root,
.dark {
  --background: #000000;
  --foreground: #ffffff;
  --surface: #0a0a0a;
  --surface-alt: #141414;
  --border: rgba(255, 255, 255, 0.12);
  --muted: rgba(255, 255, 255, 0.6);
  --accent: #ffffff;
}
/* @chrome:end */

the tokens

--background / --foreground — the page. components mostly use raw white-with-opacity classes on top of this, so shifting the background off pure black is the highest- impact edit.
--surface / --surface-alt — raised panels (cards, editors, popups).
--border — the 1px lines everywhere. raise the alpha for a harder grid, lower it to soften.
--muted / --accent — secondary text and the (white) highlight color.
--font-sans — swap poppins for anything; the mono styles use your tailwind font-mono stack.

editing safely

edit any token freely. re-running initreplaces only what's between /* @chrome:theme */ and /* @chrome:end */ — everything outside the fence is untouched. if you want your token edits to survive re-init too, move them below the fence; later rules win.

component-level styling doesn't go through tokens at all: the installed source is yours, and className merges via tailwind-merge, so per-instance overrides just work.