The Web UI uses original, dark high-fantasy artwork as a restrained progressive enhancement over its procedural CSS/SVG atmosphere. It evokes a classic talent-pane composition without reproducing any game's, harness's, or third party's logos, mascots, characters, trade dress, or artwork.
- Chrome remains neutral; art belongs only to themed content wells.
- Artwork is decorative. Technical labels and the labelled terminal-glyph provenance badge carry identity and meaning.
- Backdrops are square, centre-safe masters: keep the meaningful motif inside the central 45% so one image works in both the wide detail well and tall carousel column.
- Portraits are square, emblem-like close-ups that stay legible at 72–96px.
- Use near-black edges, one dominant theme hue, tactile material detail, and restrained glow. Never include text, letters, UI controls, or watermarks.
- Harness art is an original, brand-adjacent aesthetic interpretation of the harness's established color character; it does not claim to represent how that harness operates. Role-pack art may suggest the type of work the role performs.
Each pair contains a centre-safe backdrop and a square decorative portrait. The first set was generated on 2026-07-17; the revisions called out below were generated on 2026-07-18. All use Codex built-in image generation and are original, logo-free, text-free, and watermark-free.
| Theme | Motif | Asset directory |
|---|---|---|
| Pi / The Wayfinder | Brass celestial wayfinder backdrop with a blueberry-and-starlight pie-slice portrait | src/web/assets/themes/pi/ |
| CMD / The Shadecaller | Original shadowform void cleric in charcoal and vivid #751cfc violet |
src/web/assets/themes/cmd/ |
| Claude Code / The Emberwright | Copper-orange mechanical crab and claw | src/web/assets/themes/claude-code/ |
| Codex / The Chronicler | Teal flying folio and key | src/web/assets/themes/codex/ |
| Hermes / The Herald | Nous-blue gothic moonlight and banner-inspired head portrait; square center-safe backdrop v2 | src/web/assets/themes/hermes/ |
| Inquisitor | Crimson balance, dossier, and lantern | src/web/assets/themes/role-pack/inquisitor/ |
| Artisan | Amber forge tools and craft seal | src/web/assets/themes/role-pack/artisan/ |
| Cartographer | Verdigris compass and relief map | src/web/assets/themes/role-pack/cartographer/ |
| Loremaster | Indigo open grimoire, crystal, and silver leaves | src/web/assets/themes/role-pack/loremaster/ |
| Runekeeper | Violet rune-carved mechanism (the former CMD harness art, preserved as a built-in role theme) | src/web/assets/themes/role-pack/runekeeper/ |
The original CMD Runekeeper pair was the calibration source. Future art pairs should match this visual contract and record their generation brief and date here.
The following 42 role-pack pairs were generated on 2026-07-19 with the same dark atmospheric painterly direction. Each portrait makes the role's class fantasy the focal point; each backdrop uses a complementary environment, workspace, landscape, or system rather than reproducing that focal subject. The listed identity color is the base hue used by the Web UI theme manifest.
| Role | Identity color | Asset directory |
|---|---|---|
| Logistics Coordinator | #3f6f91 |
src/web/assets/themes/role-pack/logistics-coordinator/ |
| Security Operator | #4b6175 |
src/web/assets/themes/role-pack/security-operator/ |
| Historian | #9a6b3f |
src/web/assets/themes/role-pack/historian/ |
| Incident Response & Disaster Recovery Specialist | #b34a44 |
src/web/assets/themes/role-pack/incident-response-disaster-recovery-specialist/ |
| Supply Chain Researcher | #2f8f8a |
src/web/assets/themes/role-pack/supply-chain-researcher/ |
| Experimenter | #2b9fa3 |
src/web/assets/themes/role-pack/experimenter/ |
| OSINT Specialist | #c1973a |
src/web/assets/themes/role-pack/osint-specialist/ |
| Judge | #8f3f52 |
src/web/assets/themes/role-pack/judge/ |
| Attorney | #7d3543 |
src/web/assets/themes/role-pack/attorney/ |
| Polymath | #8067b3 |
src/web/assets/themes/role-pack/polymath/ |
| Intelligence Analyst | #3d5f9a |
src/web/assets/themes/role-pack/intelligence-analyst/ |
| Forecasting Analyst | #b39345 |
src/web/assets/themes/role-pack/forecasting-analyst/ |
| Engineer | #3f6e9e |
src/web/assets/themes/role-pack/engineer/ |
| Founder | #b56e45 |
src/web/assets/themes/role-pack/founder/ |
| Medic | #4a9b8b |
src/web/assets/themes/role-pack/medic/ |
| Strategic Planner | #8e7444 |
src/web/assets/themes/role-pack/strategic-planner/ |
| Automation Technician | #c27a3f |
src/web/assets/themes/role-pack/automation-technician/ |
| Park Ranger | #4e8a63 |
src/web/assets/themes/role-pack/park-ranger/ |
| Bounty Hunter | #9a513e |
src/web/assets/themes/role-pack/bounty-hunter/ |
| Technical Writer | #627b96 |
src/web/assets/themes/role-pack/technical-writer/ |
| Creative Writer | #9a5686 |
src/web/assets/themes/role-pack/creative-writer/ |
| Performance Coach | #d36858 |
src/web/assets/themes/role-pack/performance-coach/ |
| Paranormal Claims Investigator | #5a9ca4 |
src/web/assets/themes/role-pack/paranormal-claims-investigator/ |
| Precision Manufacturing Engineer | #66818b |
src/web/assets/themes/role-pack/precision-manufacturing-engineer/ |
| Short-Order Chef | #c65a49 |
src/web/assets/themes/role-pack/short-order-chef/ |
| Beekeeper | #c99038 |
src/web/assets/themes/role-pack/beekeeper/ |
| Open Source Developer | #4f9d6b |
src/web/assets/themes/role-pack/open-source-developer/ |
| Secure Software Development Specialist | #3f8080 |
src/web/assets/themes/role-pack/secure-software-development-specialist/ |
| Environmental Restoration Engineer | #5b8c59 |
src/web/assets/themes/role-pack/environmental-restoration-engineer/ |
| Community Radio Host | #c37a48 |
src/web/assets/themes/role-pack/community-radio-host/ |
| Blue-Teamer | #4676ad |
src/web/assets/themes/role-pack/blue-teamer/ |
| Red-Teamer | #a44348 |
src/web/assets/themes/role-pack/red-teamer/ |
| Purple-Teamer | #7857a8 |
src/web/assets/themes/role-pack/purple-teamer/ |
| Ethical Researcher | #7f8c4e |
src/web/assets/themes/role-pack/ethical-researcher/ |
| Ethical Hacker | #76a74a |
src/web/assets/themes/role-pack/ethical-hacker/ |
| Librarian | #8b6c50 |
src/web/assets/themes/role-pack/librarian/ |
| Personal Knowledge Manager | #6470a5 |
src/web/assets/themes/role-pack/personal-knowledge-manager/ |
| Archivist | #a18461 |
src/web/assets/themes/role-pack/archivist/ |
| Biologist | #59956a |
src/web/assets/themes/role-pack/biologist/ |
| Golemancer | #8858a9 |
src/web/assets/themes/role-pack/golemancer/ |
| Mechanist | #ad8a46 |
src/web/assets/themes/role-pack/mechanist/ |
| Necromancer | #6e4e91 |
src/web/assets/themes/role-pack/necromancer/ |
stargazer-pie-portrait.webp was generated on 2026-07-18 using the Pi
Wayfinder backdrop and original blue-lantern portrait as style references. The
brief requested a centered, circular-crop-safe slice of blueberry-and-starlight
pie on an engraved brass astrolabe plate, with constellation highlights and
steam, readable at 72–96px. No frame was baked in; the shared CSS token frame
supplies the harness-color surround.
shadecaller-backdrop.webp and shadecaller-portrait.webp were regenerated on
2026-07-19 as an original shadowform-purple pair, then given a detail-restored
high-resolution pass for large web surfaces. The portrait brief requested
a mostly faceless void presence emerging from charcoal-black robes and purple
ethereal mist, with only restrained violet eyes and crystalline accents. The
backdrop brief requested an empty ruined observatory-sanctum with gothic
architecture, floating stone, reflective obsidian, and arcane geometry; it
explicitly excluded any person, creature, statue, face, or character silhouette
so it complements the portrait without repeating its subject. Both briefs used
deep purple rather than indigo, with #751cfc reserved for concentrated
identity accents, and excluded existing copyrighted characters, franchise
costumes/symbols, card layouts, logos, text, and watermarks.
The previous CMD Runekeeper files were moved intact to
assets/themes/role-pack/runekeeper/ and remain selectable as
role-pack:runekeeper; they were not discarded or overwritten.
herald-backdrop-v2.webp was generated with Codex built-in image generation
on 2026-07-18 using the original herald-backdrop.webp as the edit target and
style/subject reference. The generation brief preserved the dark-haired seated
herald, chair, table, moon, gothic arch, cobalt/black/white palette, and inked
illustration style while recomposing those meaningful elements into the central
45% of a square canvas. This fixes the original landscape image's severe crop
in square harness cards without redesigning the theme. The original file is
retained as provenance but no longer referenced by the manifest.
src/web/assets/textures/parchment-fiber-v2.webp is a generated 1254px square
seamless parchment material, created with Codex built-in image generation on
2026-07-18 and converted to WebP at quality 88. The generation brief called
for warm oat/antique-ivory cotton and flax fibers, diffuse illumination, even
detail distribution, soft multi-scale age clouding, and no borders, stains,
dirt/static speckle, writing, symbols, folds, burns, or focal objects. It is
decorative and carries no configuration meaning.