Skip to content
playcanvasPublic

About

Reusable skills for AI coding agents working with PlayCanvas products

Topics

Resources

Contributing

Stars

28 stars

Watchers

1 watching

Forks

Repository files navigation

PlayCanvas Skills

Skills.sh Version CI License Context Discord Reddit X

| Skills.sh | Developer Site | Engine Manual | API Reference | Examples | Forum |

Portable skills that help AI coding agents build and verify polished applications with playcanvas, @playcanvas/react, and @playcanvas/web-components.

Install

Add the skills to your project with the Agent Skills installer:

npx skills add playcanvas/skills

Use --all to install every skill into all detected agents or -g for a user-level installation. Start a new conversation after installing or updating so the agent discovers the new skill metadata.

Choose one installation route for each agent. Installing both Agent Skills and a native plugin for the same agent exposes duplicate skills.

Native plugins

Claude Code and Claude Code desktop
claude plugin marketplace add playcanvas/skills
claude plugin install playcanvas@playcanvas

In the desktop app's Code tab, installed plugins are available under + → Plugins.

Codex CLI and app
codex plugin marketplace add playcanvas/skills
codex plugin add playcanvas@playcanvas

The Codex app uses the same marketplace and plugin installation.

Cursor

For a single CLI session, load the plugin directly from a checkout:

cursor-agent --plugin-dir .

For a persistent installation, add this repository as a plugin marketplace in Cursor or link the repository root into ~/.cursor/plugins/local/playcanvas. Teams and Enterprise organizations can publish the same marketplace to their organization.

Why PlayCanvas Skills

  • Resolve the active PlayCanvas authoring surface from the project instead of guessing from installed dependencies.
  • Check installed package declarations, exports, examples, and production scripts before using an API.
  • Inspect GLB geometry, transforms, clips, joints, morphs, and hierarchy before choosing placement or animation values.
  • Keep scene ownership, model calibration, physics, effects, UI, and app state predictable.
  • Reuse Engine features such as CameraControls, Water, ProceduralSky, and CameraFrame with their required integrations intact.
  • Finish with runtime and screenshot evidence instead of treating a successful build as visual proof.

Usage

Ask your coding agent for the outcome you want. The matching skills supply the PlayCanvas-specific workflow and verification steps. For example:

Build a Direct Engine product viewer for these GLBs. Inspect and calibrate every model, reuse the
shipped camera controls, and verify grounding and framing in the browser.
Polish this @playcanvas/react prototype with compressed assets, reused Engine scripts, pooled
effects, deliberate lighting and tone mapping, and screenshot checks.

Supported surfaces

The skills resolve the active surface from imports and markup, then read only its matching reference:

Surface Packages Coverage
Direct Engine playcanvas bootstrap, assets, scripts, rendering, animation, physics, lifecycle
React playcanvas, @playcanvas/react React ownership, hooks, components, assets, Engine interop
Web Components playcanvas, @playcanvas/web-components declarative elements, lifecycle, assets, Engine interop

Skills prefer the packages installed in the target project. CI compiles representative usage against pinned supported package versions, and Renovate proposes dependency updates.

Skills

Skill Purpose Tokens
build-app Select and structure Direct Engine, React, or Web Components applications. ~550
apply-conventions Apply stable coordinates, transforms, physics, materials, imports, and verification rules. ~550
find-examples Find and adapt official examples matching the installed package version. ~550
reuse-scripts Discover and integrate production scripts shipped with the Engine. ~450
inspect-glb Measure default-pose GLB bounds, transforms, clips, joints, morphs, and hierarchy offline. ~450
inspect-runtime Read live app state through the Engine devtools hook without changing app code. ~550
load-assets Load glTF containers, set up Draco and Basis decoders, and choose compression. ~500
calibrate-model Record stable scale, grounding, pivot compensation, and yaw for repeated models. ~400
configure-animation Configure clip playback, blending, state graphs, and retargeting from inspected data. ~450
assemble-scene Compose semantic, visual, collider, physics, and effect hierarchies. ~400
light-scene Set lighting, environment, shadows, tone mapping, exposure, and post-processing. ~500
add-effects Choose particles, custom shaders, geometry, or screen effects for transient visuals. ~350
verify-pixels Prove a rendering change is pixel-identical or bounded before shipping. ~400
reduce-draw-calls Measure and cut draw calls with element lifecycle, batching, and instancing. ~450
override-shader-chunks Customize StandardMaterial shading with version-pinned shader chunk overrides. ~400
bake-lighting Precompute static lighting with the engine Lightmapper or an offline bake. ~450

Every integration loads the same canonical files from skills/. Host manifests contain distribution metadata only.

PlayCanvas Skills targets Engine application workflows. It does not automate the PlayCanvas Editor, create or publish Editor projects, manage cloud services, or replace project-specific art direction and gameplay design.

Context cost

Agents load only each skill's name and description at session start, about 700 tokens for all 16 skills. A skill's full instructions load when a task triggers it, adding 350–550 tokens, plus at most one surface reference of up to 500 tokens. Estimates assume 4 characters per token. Each skill stays within the word budget in AGENTS.md.

Data and network use

The skills collect, store, and send no user data, and the plugin has no hooks or MCP servers. A few skills tell the agent to run commands on the user's machine:

  • inspect-glb runs its bundled scripts/inspect.mjs on local GLB files. For compressed files it runs npx --yes @gltf-transform/cli@4.4.2, which downloads that pinned package from npm.
  • inspect-runtime injects its bundled scripts/devtools-hook.js into the app's own page.
  • find-examples reads official examples from the public playcanvas/engine, playcanvas/web-components, and playcanvas/developer-site repositories with gh api when they are not installed locally.

Contributing

See CONTRIBUTING.md for pull-request expectations. For repeatable skill failures, use the skill feedback template and include the prompt, surface, package versions, output, and smallest incorrect behavior. Report vulnerabilities through GitHub Security Advisories.

License

PlayCanvas Skills is released under the MIT License.

About

Reusable skills for AI coding agents working with PlayCanvas products

Topics

Resources

Contributing

Stars

28 stars

Watchers

1 watching

Forks

Releases

Contributors

Languages