filters-and-postfx

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

1|Updated May 3, 2026

Search Tags:#filters #shaders #webgl #post-processing #bloom #phaser 4

Ready to run

npx skills add https://github.com/WanderTheWeeb/papas_trauma --skill filters-and-postfx-wandertheweeb

💬 Prompt for ChatGPT / Claude Chat▼

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.