Skip to main content
The plugin includes 18 skills — 14 framework and reference skills plus 4 workflow skills. They form the knowledge layer that commands, subagents, Codex workflows, and Cursor workflows rely on.

​
How skills load

LevelWhen loadedWhat it contains
MetadataAlways (at startup)Skill name and description
InstructionsWhen triggered by your promptFull SKILL.md content
ResourcesAs needed by instructionsBundled reference files, code examples
The agent only loads what’s relevant. Multiple skills load in parallel when a task spans topics.

​
Framework integration skills

SkillFrameworkIntegration pattern
userplane-reactReact (Vite)Provider component in useEffect
userplane-nextjsNext.js (App Router)'use client' provider component
userplane-vueVue 3 (Vite)Vue plugin
userplane-angularAngular 17+APP_INITIALIZER
userplane-nuxtNuxt 3.client.ts browser-only plugin
userplane-astroAstroClient-side <script> blocks
userplane-sveltekitSvelteKitonMount in root +layout.svelte
userplane-tanstack-startTanStack StartSearch-param schema + provider
userplane-static-htmlStatic HTMLCDN script tags, no build step
Each skill covers the full integration: CDN quick start, npm SDK, URL parameter preservation, sensitive data, metadata, SSR safety, environment variables, and troubleshooting.

​
SDK and reference skills

SkillCovers
userplane-web-sdkinitialize(), open(), unmount(), recording state, session IDs
userplane-metadata-sdkset(), metadata(), clearMetadata(), URL parameter metadata
userplane-cdnScript placement, CSP directives, redirect handling
userplane-sensitive-datadata-userplane-blur, meta tag blur, third-party compatibility
userplane-best-practicesCross-cutting install, SDK, metadata, and privacy guidance

​
Workflow skills

SkillCovers
userplane-integrateDetect framework and install Userplane as concrete edits
userplane-auditRead-only PASS/FAIL integration audit with suggested diffs
userplane-debugRecording root-cause analysis through the workspace MCP
userplane-privacyRead-only PII, blur, metadata, and CSP privacy audit

​
Example prompts

Add Userplane to this SvelteKit app. Use the npm package, not the CDN.

What arguments does initialize() accept? I want to pass a custom session ID and disable auto-open.

We use Stripe Elements for payment and Auth0 for login. What CSP headers do I need for Userplane to work alongside them?

How do I attach the logged-in user's ID to recordings without exposing their email address?

The Userplane iframe is blank in production but works in dev. What's likely wrong?

​
Framework detection

The /userplane:integrate and /userplane:audit commands auto-detect the framework by reading package.json.
DependencySkill loaded
nextuserplane-nextjs
nuxtuserplane-nuxt
@angular/coreuserplane-angular
vue (without nuxt)userplane-vue
@sveltejs/kituserplane-sveltekit
astrouserplane-astro
@tanstack/react-startuserplane-tanstack-start
react (with vite, no metaframework)userplane-react
Top-level index.html, no bundleruserplane-static-html

​
Compatibility

Skills follow the open Agent Skills standard. They work with Claude Code (via plugin), Cursor, Windsurf, and any agent that supports the standard.
Claude Code users usually start with slash commands. Cursor users can use Cursor workflow commands. Codex users can invoke the workflow skills directly with $userplane-*.