filters-and-postfx

Apply glow, blur, and color filters to Phaser 4 objects and cameras.

Updated Apr 26, 2026
One-click install
npx skills add https://github.com/kehwar/pixi-square --skill filters-and-postfx-kehwar
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: filters-and-postfx
Source: https://github.com/kehwar/pixi-square/tree/main/.agents/skills/filters-and-postfx
Command: npx skills add https://github.com/kehwar/pixi-square --skill filters-and-postfx-kehwar

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Phaser 4 projects often struggle to implement consistent and performant visual effects across objects and cameras. This skill provides a structured approach to applying post-processing filters, glow, blur, color transformations, and masks, ensuring visuals stay cohesive.

Core Features & Use Cases

  • Per-object and camera-wide filter management using internal and external FilterList patterns
  • Support for common effects: glow, blur, color matrix, vignette, masks, and displacement
  • Reusable patterns for chaining filters, masking sources, and optimizing render cost

Quick Start

Create a scene and apply a glow to a sprite using the 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?

Visual filters in Phaser 4 are applied using the FilterList API and the enableFilters lifecycle. This approach allows you to compose per-object and camera-wide post-processing effects like glow and blur.

Can I chain multiple post-FX like glow and blur on a single Phaser sprite?

Yes, you can chain multiple post-FX effects on a single Phaser sprite. The skill provides reusable patterns for chaining filters, masking sources, and composing effects while optimizing render cost.

What is the best way to manage post-processing performance across Phaser scenes and UI?

To manage post-processing performance, enforce the FilterList API and available filter controllers. This ensures cohesive visuals across scenes and UI while applying performance considerations to render cost.

Does this approach support camera-wide color adjustments and masks?

Yes, the approach supports camera-wide color adjustments, vignettes, and masks. It leverages internal and external FilterList patterns to apply these transformations consistently across objects and cameras.

Why use the FilterList API instead of individual shaders for post-processing?

Using the FilterList API provides a structured approach to applying consistent and performant visual effects. It ensures cohesive visuals across objects and cameras, avoiding the fragmentation of managing individual shaders.

What are the limitations of chaining filters in Phaser 4?

While chaining filters creates polished visuals, limitations include increased render cost. The skill addresses this by enforcing available filter controllers and performance considerations to optimize complex effect chains.