filters-and-postfx

Apply GPU-based visual filters and post-processing effects to Phaser 4 scenes.

40.1k|7.2k|Updated Apr 12, 2013
One-click install
npx skills add https://github.com/phaserjs/phaser --skill filters-and-postfx-phaserjs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: filters-and-postfx
Source: https://github.com/phaserjs/phaser/tree/main/skills/filters-and-postfx
Command: npx skills add https://github.com/phaserjs/phaser --skill filters-and-postfx-phaserjs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Streamline applying GPU-based visual filters and post-processing effects to Phaser 4 scenes, enabling rich visuals without low-level shader coding.

Core Features & Use Cases

  • Enable and manage internal and external filters on game objects and cameras.
  • Build complex effects with Bloom, Blur, Glow, ColorMatrix, and Masking, using a unified API.
  • Ideal for real-time effects in games, demos, and interactive scenes that require dynamic post-processing.

Quick Start

Enable filters on a camera or game object and start applying built-in filters like Glow, Blur, or Vignette.

Frequently Asked Questions about filters-and-postfx

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

FAQPage Schema
How do I apply real-time bloom and glow post-processing effects in Phaser 4?

Apply real-time bloom and glow post-processing effects in Phaser 4 by enabling filters on game objects or cameras, then adding built-in filters via the FilterList API. This GPU-based approach renders dynamic visual results.

What are visual filters and post-processing in Phaser 4 scenes?

Visual filters and post-processing in Phaser 4 scenes are GPU-based effects applied to sprites and cameras. They enable real-time adjustments like blur, color matrix changes, and masking without writing low-level shader code.

Do I need WebGL to use Phaser 4 camera filters and shaders?

Yes, you need WebGL to use Phaser 4 camera filters and shaders. The post-processing system relies on WebGL to execute GPU-based rendering for effects like masking and dynamic color adjustments.

What's the best way to manage internal and external filters on game objects?

The best way to manage internal and external filters on game objects is using Phaser's unified FilterList API. You must first enable filters on the target object before applying effects like glow or blur.

Can I apply custom shaders and color matrix adjustments to Phaser 4 sprites?

Yes, you can apply custom shaders and color matrix adjustments to Phaser 4 sprites. The system exposes internal and external filter lists, allowing you to build complex visual effects across individual game objects.