FolioTier 2
@color-matrix
Apply a Pixi ColorMatrixFilter (brightness/contrast/saturation/hue) to a sprite or the whole in-world frame.
@color-matrix applies a color-grading filter to a specific sprite or to everything visible in the scene at once. You reach for it whenever a moment needs a shift in mood without swapping any assets - dimming and desaturating a rainy alley at 3 a.m., washing a memory sequence in pale warmth, or snapping a portrait to high contrast during a tense reveal.
The construct transitions smoothly from the scene's current color state to the values you specify, so you can chain calls back to neutral just as naturally as you pushed away from it. The canonical example above shows this rhythm: push the whole frame into a cold, dim look before the line lands, then ease it back out to signal the moment passing.
When target is empty, the filter lands on the in-world frame, which means UI elements like dialogue boxes are unaffected. If you name a sprite tag instead, only that sprite's colors shift while the rest of the scene stays put - useful for spotlighting one character without touching the background or other sprites on stage.
Hue rotation wraps at the 360-degree boundary, so a transition from 350 to 10 will travel the long way around the color wheel unless you plan the sequence carefully. If you need the short arc, keep rotations within a single crossing of zero.
Setting wait to false lets you layer a color shift under a say verb or another effect without stalling the script. Be cautious about firing a second @color-matrix on the same target before the first finishes - the new call interrupts from wherever the filter sits at that instant, not from your intended baseline. If you need a clean starting point, send an explicit reset to defaults before beginning the next transition.
Parameters
| Parameter | Kind | Required | Default | Notes |
|---|---|---|---|---|
| target | string | no | "" | Optional sprite tag; empty targets the whole frame. |
| brightness | number | no | 1 | 0-3 × multiplier. Default 1. |
| contrast | number | no | 1 | 0-3 × multiplier. Default 1. |
| saturation | number | no | 1 | 0-3 × multiplier. Default 1. |
| hue | number | no | 0 | -360 to 360 degrees. Default 0. |
| duration | number | no | 0.4 | 0-3 seconds. Default 0.4. |
| wait | boolean | no | false | Block for the effect's duration when true; false fires and continues so effects can overlap. |
Canonical example
bg city-rooftop
@color-matrix(0.6, brightness=0.6, saturation=0.5)
say "Liam": "It's been a long night."
@color-matrix(0.4, brightness=1, saturation=1)
@color-matrix attaches a Pixi ColorMatrixFilter to either a single
sprite (when target is set) or the whole in-world frame (camera
container - when target is empty). The filter persists until its
parameters return to identity.
Identity = no filter
brightness=1, contrast=1, saturation=1, hue=0 is the identity
matrix. When all four return to identity, the filter detaches on tween
completion. So to remove a color grade, tween every non-identity
parameter back:
@color-matrix(0.6, brightness=0.6, saturation=0.5)
say "Liam": "..."
@color-matrix(0.4, brightness=1, saturation=1)
If brightness was changed but hue is still at identity, only
brightness needs to return; hue already meets identity.
Tuning
- Dusk / dawn -
brightness=0.7, saturation=0.6, hue=-20 - Cold sterile -
brightness=1.1, contrast=1.2, saturation=0.5, hue=20 - Sepia warm -
brightness=1.0, saturation=0.3, hue=30 - Grayscale -
saturation=0 - Night -
brightness=0.5
Per-character grading (e.g. greyscale on a specific sprite for a
flashback) is the target use case.
Composition with @blur
@blur and @color-matrix apply independently - both filters can
coexist on the same target. They compose at render time (blur runs
first, then color grade).
Notes
@color-matrix runs on the Pixi stage.
See also
@blur- Pixi BlurFilter@sprite-color-matrix- the same color grade scoped to a single spritesprite- mounts the sprite thattargetmatches