Install

Design

Playground

Tune Pax component props live in the workspace before installing into your project.

1 min readUpdated

The playground now lives inside the workspace, the single catalog for all 162 live items: effects, components, blocks, templates, and charts. Every detail page includes a prop tuner wired to the real component, so what you adjust is what installs.

Use it to decide how an effect should feel before you run shadcn add or paxfx effects add.

What you can tune

On a workspace detail page you can:

  • Adjust effect-specific props (intensity, color, speed, distortion) against the live runtime
  • Toggle reduced motion and performance tier
  • Switch responsive frame presets to see mobile and desktop behavior
  • Replay entrance animations
  • Read the actual source and copy install commands for all six frameworks

Changes apply to the real component runtime, not a simplified mock.

Workflow

  1. Open the workspace and pick an item
  2. Adjust props until the effect matches your intent
  3. Copy the install command for your framework
  4. Install into your repo and carry the prop values over

CLI alternative

paxfx effects info liquid
paxfx effects add liquid --framework react

effects info prints metadata, engine type, reduced-motion behavior, and install commands for every framework.

Next steps

Browse componentsFull catalog with install tabs per framework.LiquidStart with the flagship fluid simulation.MCPAgents can list effects and return install commands.WorkspaceEvery catalog item running live on pax.sh.

Was this page helpful?

Edit this page

Answers are not recorded or transmitted. Pax has no telemetry.