THREE.js extension for rendering point cloud sprites
JavaScript HTML CSS
Failed to load latest commit information.
FlashAnimationExporter Deleted May 22, 2015
assets Updated THREE to r71 May 23, 2015
editor Fixed scene transitions not working on iOS Jul 28, 2015
PixelBox Editor.crx Fixed scene transitions not working on iOS Jul 28, 2015
example2.html Fixed scene transitions not working on iOS Jul 28, 2015
example4.html Added support for CANNON physics library (no constraints yet) to Pixe… Jan 23, 2015
example6.html No commit message Jan 19, 2015
example9.html Added FxSprite example, fixed texture bugs. May 22, 2015
index.html Added FxSprite example, fixed texture bugs. May 22, 2015

Santa PixelBox

PixelBox - an extension for three.js, for rendering voxel sprites.

It includes base classes, a sprite and scene editor, and some examples.

PixelBox was originally developed to create Santa Drop game for iOS, and then expanded with extra tools and released as open source.


Project source also contains above examples, as well as the Scene Editor as Google Chrome extension / app.


PixelBox Wiki has all available documentation for this project.

PixelBox sprites

  • Based on THREE.PointCloud.
  • Multiple named animations, that can be played or looped at variable speed, forward or backward.
  • Named anchors that are animated along with sprite's frames. They can be used, for example, to specify where the character's hand is during different animations. Other objects can be added to anchors, which serve as simple containers.
  • Ability to tween any property, such as opacity, position, or color.
  • Support transparent and self-illuminated voxels.
  • Cast and receive shadows.
  • Sprite opacity, tint, and additive color.
  • Sprite stipple (pattern transparency).
  • Animation and anchor events.
  • Static scenery can be merged into a single pointcloud for faster drawing.

PixelBoxScene class

  • Parses / populates scenes created with PixelBox scene editor.
  • Easy scene hierarchy access by object name. e.g. scene.robot.head.eyeball
  • Supports instancing of templates created with scene editor.
  • Object recycling: instead of destroying objects, they get recycled for quicker reuse.
  • CANNON physics integration.

PixelBoxAssets class

  • Easy preloading of assets - PixelBox scenes, sprites, image textures, and json files.
  • Load progress and complete notifications.

PixelBoxRenderer class

  • Used to switch between PixelBox scenes, with or without transitions.
  • Scene transitions using textures or blends are adopted from three.js examples.
  • Built-in downsampling of resolution rendering.

LinePath class

  • Moves objects along a path in space using tweens.
  • Integrated into Scene Editor.

FxSprite class

  • Play Adobe Flash MovieClips animations.
  • Supplied exporter (JSFL) for Adobe Flash CS6 or higher.


You can contact the developer by email