Skip to content
A shader to display GIF for A-Frame VR.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist dist Apr 2, 2019
lib 87a GIFs aren't supported by @Danpollak Apr 2, 2019
.babelrc first commit Apr 17, 2016
.gitignore first commit Apr 17, 2016
LICENSE first commit Apr 17, 2016 readme Apr 2, 2019
example.gif readme Apr 2, 2019
index.js Fix for edge case when gif data is invalid by @UXVirtual Apr 2, 2019
package.json 0.9.1 Apr 2, 2019
webpack.config.js first commit Apr 17, 2016

AFrame GIF Shader

A gif shader for A-Frame VR. Inspired by @gtk2k's awesome sample.

To control, please use aframe-gif-component.



Now transparent gif are supported! 🎉🎊


  • Basic material's properties are supported.
  • The property is pretty much same as flat shader.
Property Description Default Value
src image url. @see Textures null
autoplay play automatecally once it's ready true

For refference, please check the following links:


Browser Installation

Install and use by directly including the browser files:

  <title>My A-Frame Scene</title>
  <script src=""></script>
  <script src=""></script>

    <a-entity geometry="primitive:box;" material="shader:gif;src:url(nyancat.gif);color:green;opacity:.8"></a-entity>

NPM Installation

Install via NPM:

npm i -D aframe-gif-shader

Then register and use.

import 'aframe'
import 'aframe-gif-shader'


Thank you so much 🙏

You can’t perform that action at this time.