Style guide & mascot

This page is the visual style reference for the videoclaw docs — the palette, the illustration style, and Clawbot, our mascot. Use it to keep new graphics on-brand.

Meet Clawbot

Clawbot is the friendly green claw-bot you'll meet across these docs — one recognizable character that does a different job on every section's page (plugging in providers, napping while the overnight queue renders, holding the clapperboard at the approval gate, and so on). One mascot, many roles = instant recognition.

Reproduce Clawbot consistently

Clawbot is a saved Go Bananas character (ID 291, name Clawbot). Generate new on-model scenes with generate_with_character (character 291) rather than describing it from scratch — that's what keeps every image the same little bot.

Palette

Role	Color	Hex
Ink (backgrounds)	charcoal near-black	#1a1815
Paper / text on dark	warm cream	#faf8f5
Action / accent	electric lime	#d4ed5b
Alert / secondary accent	rust orange	#c4450c
Muted secondary	warm grey	#3a3833

Illustration style

• Backgrounds are solid charcoal #1a1815 with a soft glow — never busy.
• Flat, modern, lightly cel-shaded illustration with a gentle glow; premium, not clip-art.
• No text inside images — labels live in the page, not the artwork.
• Lime is the hero accent, rust is the secondary, cream is for structure.
• Diagrams (flowcharts) use the same palette; see the live Mermaid diagrams on the feature pages and the brand infographics in docs-site/public/.

Two kinds of graphics

1. Clawbot scenes — one per feature page, generated from character 291. Stored in docs-site/public/mascots/<feature>.jpg.
2. Brand infographics & diagrams — the assembly-line hero, the provider-routing flowchart, etc., in docs-site/public/graphics/ and docs-site/public/diagrams/, plus live Mermaid in the pages.

How to add a new Clawbot graphic

generate_with_character
  character_id: 291
  aspect_ratio: "16:9"
  resolution_tier: "2k"
  scene_prompt: "Clawbot <doing the new thing>. Solid charcoal near-black
    background, soft lime glow, flat illustrated brand style, no text, wide
    landscape header composition."

Then save it to docs-site/public/mascots/<name>.jpg and reference it with a markdown image. Keep the background charcoal, keep Clawbot on-model, and never bake text into the image.