Customise the buddy

Style the widget, swap the art style, and tune evolution stages to match your brand.

The buddy widget is opinionated but configurable. Most products change two things: the art style and the brand tokens.

Art style

At preset selection you pick a creature style — cute, sci-fi, fantasy, minimal, playful, or custom. The image generator is primed with this style for egg art, hatch art, and every evolution stage.

If none of the presets fit, upload a style reference image under Settings → Art style. Hatched will sample the palette, silhouette, and texture characteristics and apply them to generated buddies.

Brand tokens

The widget uses four colour tokens that you set in the dashboard:

accent — the primary call-to-action colour (coin-earn, hatch button)
accent-strong — hover/pressed state
paper — background
ink — text and outlines

Additional design tokens (radii, shadows, typography) follow a small opinionated set — adjust them in the brand kit, not per page.

Per-page overrides

For dense UIs or embedded contexts, pass an accent override directly on the widget element:

<div
  data-hatched-widget="buddy"
  data-hatched-token="…"
  data-hatched-accent="#FF6B4A"
  data-hatched-size="sm"
></div>

The Shadow DOM picks these up via CSS variables.

Evolution stages

Each evolution stage gets a different image. You control the count (3–6), the conditions (XP, skill level, badges, coins), and whether evolution is automatic or user-triggered.

For a complete design conversation with the art generator, see Evolution.

Equip slots

Marketplace items snap into one of a fixed set of equip slots: hat, outfit, accessory, background, companion. Each item declares which slots it uses. When designing items, stick to the slot's silhouette so the art layering stays clean across evolution stages.