Concepts

Pax organizes creative engineering around durable concepts. Understanding them helps agents and developers produce consistent output without reinventing motion systems on every task.

Scenes#

A scene is a versioned JSON document describing layers, timing, assets, tracks, and interaction hooks. Scenes are the canonical creative artifact in Pax.

Scenes compile to multiple runtime targets: Lottie JSON, dotLottie packages, DOM layouts, React components, WebGL experiences, and spatial playback. The source model stays stable while compilers declare honest capability boundaries for each target.

{
  "version": "1",
  "name": "logo-reveal",
  "duration": 2400,
  "layers": []
}

See Scenes for the full specification.

Recipes#

Recipes are reusable creative instruments. They encode intent as reproducible commands rather than one-off prompts.

A recipe accepts parameters (copy, colors, timing, layout) and produces a scene. Agents call recipes through the CLI or MCP when they need a known-good starting point instead of generating motion from scratch.

See Recipes for available instruments and parameter schemas.

Compilers#

Compilers translate scenes into runtime targets. Each compiler documents supported layer types, export options, and known limitations.

Pax compilers are honest: if a layer type cannot compile to a target, the failure is explicit with a repair path. There are no silent drops or fake success states.

Typical flow:

Recipe / author -> Scene JSON -> Compiler -> Preview -> Export

Blocks vs components#

Blocks are full UI sections and templates: heroes, pricing tables, auth layouts, footers, and full-page starters. There are 128 hand-built assets in the registry: 56 components, 66 blocks, and 6 templates, each a dedicated implementation.

Components (effects) are atomic canvas and WebGL treatments: liquid simulation, glass lenses, particle reveals, dither objects. There are 25 effects, each in six framework flavors.

Use blocks for page sections. Use components for atmospheric treatment over existing HTML. Agents should prefer blocks when composing landing pages and components when adding creative chrome.

Preview and export#

Preview runs locally on 127.0.0.1 with hot reload and real playback controls: play, pause, step, scrub, speed, and a reduced-motion toggle that drive the actual animations. Preview is the fastest feedback loop before export.

Export writes artifacts plus reproducibility manifests. Manifests record versions, parameters, and toolchain state so output can be audited and recreated.

See Preview and Export.

Brand profiles#

Brand profiles scan a repository for color, type, spacing, and motion tokens. Agents bind Pax assets to your existing design system instead of inventing a new palette on every task.

See Brand profiles.

Critic and quality#

Critic runs visual QA, responsive checks, and performance budget validation against scenes and exports. It suggests repairs rather than silently passing broken output.

Every block and component ships performance tier metadata (low, medium, high) and documented reduced-motion fallback behavior.

See Critic, Accessibility, and Performance.

Agents and MCP#

Pax integrates with coding agents through:

• Skills that teach editors Pax conventions
• MCP tools for init, scene creation, validation, preview, export, blocks, and effects
• Installers for Cursor, Claude Code, Codex, and OpenCode

Inference is optional and user-owned. Deterministic recipes and diagnostics work with inference disabled.

See Agents and MCP.

Local-first#

No Pax account, database, or hosted GPU is required. Repository scans stay on disk unless you opt into external inference. Telemetry is off by default.

Next steps#