Routes

Routes

Code route

BW tokens reads every captured page's computed styles. It writes a brand.css with:

• the site's own :root custom properties (often its real design tokens);
• --bw-* tokens: background, text, primary, palette, fonts, sizes, spacing, radius and shadow;
• @font-face rules pointing at the site's fonts;
• recipe classes copied from the most common real element of each kind: .bw-button, .bw-button-primary (the most common coloured button), .bw-input, .bw-card, .bw-header, .bw-nav, .bw-footer, .bw-alert and .bw-hero.

<body data-site="NAME"> applies a sub-site's overrides.

The agent writes the new component as HTML on top of those, and BW render screenshots it. Text, colours, borders and fonts are exact, and the file can go to developers. Use it for anything someone will build or review word by word.

Reference route

BW ref KIT "prompt" --refs a.png b.png sends up to four screenshots to FLUX.2 klein 4B (Apache-2.0) in ComfyUI as reference images. The prompt asks for their style but not their content. It needs no training and takes about 15-30 s a picture on a 16 GB card. A batch is less consistent than with a trained LoRA.

LoRA route

• A brand LoRA learns from all sites: an equal share of each.
• Each sub-site LoRA learns from its own site only, and trains on top of the brand LoRA:
  • residual: on Z-Image, the brand LoRA is merged in during training, so the site LoRA learns only the difference. Generate with brand 1.0 + site 1.0.
  • continue: on other models, the site LoRA starts from the brand LoRA's weights. Generate with the site LoRA alone.
  • stack: independent. Weights have to be found with sweep.

Use it once the brand will be mocked up often, or when a sub-site's layout conventions matter.

Combining them

1. Explore with ref (no training) or gen (LoRAs), using several seeds.
2. Pick a direction.
3. Rebuild it with the code route: the picture is the layout reference, brand.css is the truth for styles, and your words are the copy.

Generated pictures get small text, icons and thin lines wrong. Treat them as concepts.