filters-and-postfx

Apply GPU-based Phaser 4 visual filters and post-processing effects to cameras and game objects.

1|Updated May 3, 2026
One-click install
npx skills add https://github.com/WanderTheWeeb/papas_trauma --skill filters-and-postfx-wandertheweeb
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: filters-and-postfx
Source: https://github.com/WanderTheWeeb/papas_trauma/tree/main/skills/filters-and-postfx
Command: npx skills add https://github.com/WanderTheWeeb/papas_trauma --skill filters-and-postfx-wandertheweeb

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you apply real-time visual filters and post-processing effects in Phaser 4 without manually building custom shader pipelines.

Core Features & Use Cases

  • Internal vs External filter control: Choose object-local processing (internal) or screen-space processing (external) to match the look you want, such as rotated blurs or consistent screen-aligned effects.
  • Built-in filter pipeline management: Use FilterList controllers to add, order, enable/disable, and configure effects like blur, glow, bloom-style compositing, color grading, masking, and distortion.
  • Practical effect patterns: Implement glow/blur chains, perform alpha masking via filter-based masks, create wipe/reveal transitions, and build custom bloom using ParallelFilters.

Quick Start

Enable filters on your sprite, then add a glow using the sprite's internal filter list.

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 visual filters and post-processing effects in Phaser 4?

You apply Phaser 4 post-processing effects by enabling filters on game objects and using FilterList controller APIs to add and configure effects like bloom, blur, and color grading. Effects are GPU-based and require a WebGL rendering pipeline.

What is the difference between internal and external filters in Phaser 4?

Internal filters process effects locally on the game object, allowing rotated blurs, while external filters apply screen-space processing for consistent screen-aligned effects. Choose based on whether you need object-local or screen-space visual behavior.

Can I create custom bloom and glow effects without writing custom shaders in Phaser 4?

Yes, you can build custom bloom and glow effects using built-in filter pipeline management. Combine blur and glow chains via ParallelFilters-based compositing to achieve shader-driven looks without manually building custom shader pipelines.

Does Phaser 4 filter processing work with non-WebGL renderers?

No, Phaser 4 visual filters and post-processing effects target WebGL-only rendering pipelines. You must use a WebGL renderer to apply GPU-based effects, masks, wipes, and color grading to cameras and game objects.

How do I order and manage multiple post-processing effects on a single camera?

Use FilterList controllers to add, order, enable, disable, and configure multiple effects. Respecting the correct filter order is necessary to manage internal-vs-external performance behavior and achieve the desired compositing result.

Why are my Phaser 4 screen-space filter coordinates behaving unexpectedly?

Screen-space external filters process differently than object-local internal filters. You must respect internal-vs-external coordinate behavior and performance limits when configuring effects to ensure correct visual output.