fvtt-canvas

Extend Foundry VTT canvas layers and token visuals using PIXI.js.

1|Updated Jan 4, 2026
One-click install
npx skills add https://github.com/ImproperSubset/hh-agentics --skill fvtt-canvas
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: fvtt-canvas
Source: https://github.com/ImproperSubset/hh-agentics/tree/main/fvtt-dev/skills/fvtt-canvas
Command: npx skills add https://github.com/ImproperSubset/hh-agentics --skill fvtt-canvas

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps developers extend and customize the Foundry VTT canvas rendering pipeline using PIXI.js, enabling richer visuals and efficient layering.

Core Features & Use Cases

  • Build and customize canvas layers, token visuals, and placeables (tokens, tiles, drawings).
  • Optimize rendering with render flags, layer management, and lifecycle hooks like canvasReady.
  • Create immersive visuals for Foundry modules and systems, with examples for tokens, lighting, and drawings.

Quick Start

Set up a small example that hooks into the canvasReady event to add a new overlay layer and render a sample graphic.

Frequently Asked Questions about fvtt-canvas

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I customize Foundry VTT canvas layers using PIXI.js?

To customize Foundry VTT canvas layers using PIXI.js, extend the rendering pipeline to build custom layers, placeables, and token visuals while hooking into lifecycle events like canvasReady for seamless integration.

What is the best way to optimize rendering performance for custom Foundry VTT tokens?

The best way to optimize rendering performance for custom Foundry VTT tokens is utilizing render flags, proper layer management, and PIXI.js techniques to handle visuals efficiently without introducing breaking changes to the canvas API.

Do I need to know PIXI.js basics to add custom lighting and drawings in Foundry VTT?

Yes, you need PIXI.js basics and Foundry canvas API knowledge to add custom lighting and drawings, as the system requires extending the PIXI.js rendering pipeline to implement these immersive visual effects properly.

Can I hook into the canvasReady event to render a new overlay layer in Foundry?

Yes, you can hook into the canvasReady event in Foundry to trigger actions like adding a new overlay layer and rendering a sample graphic, utilizing hands-on patterns to extend the canvas without breaking changes.

Why does modifying the Foundry VTT canvas API risk breaking changes?

Modifying the Foundry VTT canvas API risks breaking changes because it disrupts the native rendering pipeline and layer lifecycle, requiring specific hands-on patterns and render flag management to maintain system stability.