XAEM Theme UI - Theme Generation & Code Translation

Two-pass pipeline for generating high-entropy visual themes and translating them into implementable code. Works upstream of scientific-luxury constraint enforcement.

Description

XAEM Theme UI adds a creative generation layer to the design system. While scientific-luxury enforces structural constraints (OLED black, 0.5px borders, rounded-sm, physics-based easings), it does not generate themes. This skill fills that gap with a two-pass pipeline:

1. Pass 1 (Generate): Create high-entropy visual themes -- spectral colour palettes, glow intensities, animation timing scales, typography weight distributions, opacity hierarchies
2. Pass 2 (Translate): Convert generated themes into implementable code -- CSS variables, TypeScript design tokens, Tailwind config extensions, Framer Motion preset overrides, component style maps

The structural skeleton remains immutable. Only the visual skin is customisable.

When to Apply

Positive Triggers