# Apply and Optimize PixiJS v8 Filters

PixiJS filter effects can fail when shader APIs, renderer settings, or package imports do not match version 8. This skill guides filter setup, custom shaders, and performance tuning with focused examples.

## Install

```bash
npx skillstore add pixijs/pixijs-filters
```

## Metadata

- Status: approved
- Slug: pixijs-pixijs-filters
- Skillstore revision: r1
- Version status: missing
- Tree hash: 26132fed78a193b73411096890c8ab42d51f0f3b9bfca7388f9ce93e35ee483c
- Author: pixijs
- GitHub username: pixijs
- License: MIT
- Repository: https://github.com/pixijs/pixijs-skills/tree/83760c6f53462ca9cecd68055041f5a8c94758ce/skills/pixijs-filters
- Ref: 91de3b6ff493f509f03dabfa091fcaba5898cd7e
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: allowed
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: external\_commands, network
- Quality score: 78
- Quality tier: bronze
- Public page: https://skillstore.pages.dev/skills/pixijs-pixijs-filters
- Manifest: https://skillstore.pages.dev/api/skills/pixijs-pixijs-filters/manifest

## Capabilities

- Guide setup and chaining of alpha, blur, color matrix, displacement, and noise filters.
- Explain custom GLSL filters with Filter.from\(\), typed uniform resources, and animation ticker updates.
- Show current pixi-filters imports for adjustment and glow effects.
- Explain resolution, padding, antialiasing, filterArea, and shared filter instances.
- Identify obsolete constructors, legacy package imports, and inefficient per-child filter applications.
- Explain advanced blend mode imports, high-DPI resolution settings, and WebGL back buffer requirements.

## Use Cases

- Add game scene effects: Apply blur, color adjustments, displacement, or noise to game sprites and containers with appropriate filter ordering.
- Update filter integrations: Replace obsolete filter constructors and community package imports when migrating a rendering interface to PixiJS v8.
- Tune custom visual effects: Structure shader uniforms and reduce filter overhead through container grouping, resolution settings, and explicit filter areas.

## Prompt Templates

### Apply a basic blur

```
Show how to apply a BlurFilter to my PixiJS v8 sprite. Use strength 4 and explain the quality setting.
```

### Combine scene effects

```
Combine blur and brightness adjustments on a PixiJS v8 container. Explain filter order and set filterArea for an 800 by 600 scene.
```

### Migrate legacy filters

```
Review my filter code for PixiJS v8 compatibility. Replace obsolete constructors and @pixi/filter-* imports, and check WebGL back buffer requirements.
```

### Build an animated custom filter

```
Create a PixiJS v8 GLSL wave filter with Filter.from(), typed uTime resources, and ticker updates. Explain WebGPU coverage and performance tradeoffs.
```

## Limitations

- Targets PixiJS v8 rather than providing complete guidance for earlier versions.
- Provides reference instructions and snippets, not a standalone application or automated test suite.
- Mentions WGSL and WebGPU program selection but does not include a complete WGSL filter example.
- Rendering quality and performance require verification with your assets, renderer, and target devices.

## Best Practices

- Apply shared effects to a parent container when the visual result permits it, and set filterArea for known bounds.
- Use v8 options objects, typed uniform resources, and current community filter import paths.
- Test filter resolution and back buffer settings on each supported renderer and target device.

## Anti Patterns

- Using positional Filter constructor arguments or legacy @pixi/filter-\* packages in a v8 project.
- Creating identical filters on every child when one parent filter provides the intended result.
- Enabling blendRequired filters on WebGL without initializing useBackBuffer.

## Security Audit

- Audited at: 2026-11-04T15:55:34.915\+00:00
- Summary: All 59 static findings are false positives in the reviewed SKILL.md. Backticks format documentation and shader strings; URLs reference PixiJS APIs; alleged reconnaissance concerns shader entry points and graphics bounds. No evidence found of prompt injection, credential access, exfiltration, or shell execution.

## Stats

- Views: 0
- Downloads: 1
- Favorites: 0
- Popularity score: 0
