@pixi/filter-color-map
npm i @pixi/filter-color-map

@pixi/filter-color-map

Collection of community-authored custom display filters for PixiJS

by pixijs

4.1.5 (see all)License:MITTypeScript:Built-In
npm i @pixi/filter-color-map
Readme

PixiJS Filters

Node.js CI npm version

Demo

Click here to interactively play with filters to see how they work.

Filters

All filters work with PixiJS v5.

FilterPreview
AdjustmentFilter
@pixi/filter-adjustment
adjustment
AdvancedBloomFilter
@pixi/filter-advanced-bloom
advanced-bloom
AsciiFilter
@pixi/filter-ascii
ascii
BevelFilter
@pixi/filter-bevel
bevel
BloomFilter
@pixi/filter-bloom
bloom
BulgePinchFilter
@pixi/filter-bulge-pinch
bulge-pinch
ColorMapFilter
@pixi/filter-color-map
color-map
ColorOverlayFilter
@pixi/filter-color-overlay
color-overlay
ColorReplaceFilter
@pixi/filter-color-replace
color-replace
ConvolutionFilter
@pixi/filter-convolution
convolution
CrossHatchFilter
@pixi/filter-cross-hatch
cross-hatch
CRTFilter
@pixi/filter-crt
crt
DotFilter
@pixi/filter-dot
dot
DropShadowFilter
@pixi/filter-drop-shadow
drop-shadow
EmbossFilter
@pixi/filter-emboss
emboss
GlitchFilter
@pixi/filter-glitch
glitch
GlowFilter
@pixi/filter-glow
glow
Godray
@pixi/filter-godray
godray
KawaseBlurFilter
@pixi/filter-kawase-blur
kawase-blur
MotionBlurFilter
@pixi/filter-motion-blur
motion-blur
MultiColorReplaceFilter
@pixi/filter-multi-color-replace
multi-color-replace
OldFilmFilter
@pixi/filter-old-film
old-film
OutlineFilter
@pixi/filter-outline
outline
PixelateFilter
@pixi/filter-pixelate
pixelate
RadialBlurFilter
@pixi/filter-radial-blur
radial-blur
ReflectionFilter
@pixi/filter-reflection
reflection
RGBSplitFilter
@pixi/filter-rgb
rgb split
ShockwaveFilter
@pixi/filter-shockwave
shockwave
SimpleLightmapFilter
@pixi/filter-simple-lightmap
simple-lightmap
TiltShiftFilter
@pixi/filter-tilt-shift
tilt-shift
TwistFilter
@pixi/filter-twist
twist
ZoomBlurFilter
@pixi/filter-zoom-blur
zoom-blur

Built-In Filters

PixiJS has a handful of core filters that are built-in to the PixiJS library.

FilterPreview
AlphaFilteralpha
BlurFilterblur
ColorMatrixFilter (contrast)color-matrix-contrast
ColorMatrixFilter (desaturate)color-matrix-desaturate
ColorMatrixFilter (kodachrome)color-matrix-kodachrome
ColorMatrixFilter (lsd)color-matrix-lsd
ColorMatrixFilter (negative)color-matrix-negative
ColorMatrixFilter (polaroid)color-matrix-polaroid
ColorMatrixFilter (predator)color-matrix-predator
ColorMatrixFilter (saturate)color-matrix-saturate
ColorMatrixFilter (sepia)color-matrix-sepia
DisplacementFilterdisplacement
NoiseFilternoise

Installation

Installation is available using NPM:

npm install pixi-filters

Alternatively, you can use a CDN such as JSDelivr:

<script src="https://cdn.jsdelivr.net/npm/pixi-filters@latest/dist/pixi-filters.js"></script>

If all else failes, you can manually download the bundled file from the releases section and include it in your project.

Building

PixiJS Filters uses Lerna under-the-hood to build all of the filters separately. Install all dependencies by simply running the following.

npm install

Build all filters, demo and screenshots by running the following:

npm run build

Build single filter by running the following:

npm run build:prod -- --scope "@pixi/filter-emboss"

Build multiple filters where scope is a glob expression:

npm run build:prod -- --scope "{@pixi/filter-emboss,@pixi/filter-glow}"

Watch all filters (auto-rebuild upon src changes):

npm run watch

Build all filters in dev-mode (un-minified):

npm run build:dev

Documentation

API documention can be found here.

Downloads/wk

5.2K

GitHub Stars

663

LAST COMMIT

4mos ago

MAINTAINERS

3

CONTRIBUTORS

43

OPEN ISSUES

25

OPEN PRs

5
VersionTagPublished
4.1.5
latest
8mos ago
4.1.3-rc.2
prerelease
1yr ago
No alternatives found
No tutorials found
Add a tutorial