Awesome
Awesome pixi.js tools
English | 简体中文
A list of useful libs/resources/tools for renowned html5 rendering framework
Websites and forums
pixijs.com – official website.
docs – official documentation for the latest version of pixi.
examples – official examples list.
slack – official slack channel.
html5gamedev forum section – self-explanatory.
goodboydigital twitter – the creator.
goodboydigital blog – same as above.
Scene, textures, sprites, other augmentations
pixi-richtext – SDF text plugin.
pixi-display – allows to change rendering order of pixi-v4 containers without changing the stage, z-index for the win.
pixi-picture – top-quality render for sprites, removes any artifacts that are present in basic sprite.
pixi-tilemap – tilemaps with ease.
pixi-sdf-text – most efficient text rendering approach for webgl now in pixi.
pixi-tagged-text – adds a TaggedText object inside pixi.js to easily create text fields with multiple, nested styles and even inline images using a syntax similar to HTML. (Replaces pixi-multistyle-text)
pixicam – 2d camera for pixi.
pixi-super-atlas – create image atlas in your runtime, mipmaps supported.
pixi-heaven – runtime atlas, double tint for sprites, fastest glsl-calculated sprite masks.
pixi-viewport – a highly configurable viewport/2D camera designed to work with pixi.js.
canvas-latex – render latex formulas in pixi.js.
yy-rendersheet - generate on-the-fly spritesheets for pixi.js
Essential
ee3-timer – addition to ee3 and works with PIXI >4.
Debug
pixi-inspector – awesome plugin for chrome, visually inspect and modify nodes in your scene graph.
pixi-console - adds a container that shows console log. Useful on mobile devices.
gstatsjs - shows several texture-related metrics, like drawcalls. Works with Pixi, Phaser, can be integrated in custom renderers.
Animate
pixi-spine – port of official spine-ts runtime to pixi.
pixi-action – animations in Cocos2d-x style.
pixi-live2d – plugin for japanese animation tool live2d.
pixi-tween – tweens!
pixi-animate – plugin for Pixi.js which provides a runtime for content export using PixiAnimate Extension.
pixi-ease - pixi.js animation library using easing functions
[pixi-animate-extension] – Custom Platform Plugin for Adobe Animate CC (Formerly Adobe Flash CC) - to export animation for the Pixi.js renderer.
pixi-easing-graph - A component for visualizing easing functions and their animations (also includes a component for react-pixi)
Filters, shaders, vfx
pixi-filters – some official filters.
neutrinoparticles.pixi - allows you to render NeutrinoParticles effects such as water stream
pixi-after-effects-pixi5 - import Adobe AfterEffects animations as JSON into pixi.js
GUI and interaction
EZGUI – bunch of crafted UI elements to use in your app.
gown.js – UI system for pixi.js inspired by feathers-ui.
dat.gui – DOM-based GUI can be used as dev tools on top of pixi.
heatmap – WebGL Heatmap Viewer for Bioinformatics and Big Data.
Audio
pixi-sound – official WebAudio API playback without any Flash shims or HTML Audio fallback.
sound.js – a micro-library to load, play and generate sound effects and music for games and interactive applications.
Particles
pixi-particles – official particles plugin.
pixi-particles-editor – see online demo.
Game Engines
chocolatier – ClojureScript game/engine using Pixi.js for rendering.
hexi – minimalistic game engine with pixi rendering.
pixi-engine - Provides a minimal engine-like structure for developing games with PixiJS
Integrations
pixi-haxe – externs for haxe compiler.
react-pixi – integration for facebook's framework.
pixi.scala.js – externs for scala.js compiler.
react-pixi-fiber – integration with react.js framework.
react-pixi – another react.js integration with custom renderer, reconcilation, etc.
RobotlegsJS-Pixi – RobotlegsJS framework integration with PixiJS.
Books & Learning
The Book of Shaders – ✨ comprehensive book about glsl with examples in javascript and online sandbox.
WebGL How it Works – ✨ if you have zero computer graphics knowledge, the set of articles helps to get your hands on webgl api and fundamentals.
kittenattack – check that person github repositories, most of them are incredibly suited for learning.
learningPixi – definitive guide to game development with pixi.
Forks
gameofbombs – custom pixi 3.0 with static transforms, 2d camera and 2.5d transforms. Used in production on gameofbombs.com.
Tools
TexturePacker – sprite sheet packer for PixiJS with graphical user interface and command line. Optimizes sprite sheets for best render quality and low memory usage.
spritesheet.js – is command-line spritesheet (a.k.a. Texture Atlas) generator written in node.js. Support export to pixi.js
SpriteIlluminator – normal map generator for sprites. Allows creating awesome dynamic light effects.
Games
polyball – fast, multiplayer, physics-driven tennis in two dimensions..
bemuse – web-based online rhythm action game. Based on HTML5 technologies, React, Redux and Pixi.js.
breakout – breakout game made in JavaScript and Pixi.js.
duckhunt – DuckHunt ported to JS and HTML5.
doom-lgs – a multiplayer Node.js light gun shooter inspired on Doom.
rockvomit – ragdoll rhythm game.
railways – railways game.
tetris – just a tetris.
LegendOfMountainSea – 4X sandbox game with legend of Mountain and Sea Classics.