Sky Component for React

Sky is a pretty cool React component for interactive backgrounds, written by Luca Gesmundo and released under an MIT License.

Check the demo online. You can install it using :

npm install --save react-sky

Then usage like :

import React, { Component } from 'react';
import Sky from 'react-sky';

// you can pass imported images to Sky
import myImage from "./media/myImage.png"

class App extends Component {
  render() {
    return (
      <div> 
        /* Sky adapts size to its container */
        <Sky 
          images={{
            /* FORMAT AS FOLLOWS */
            0: "https://linkToYourImage0",  /* You can pass as many images as you want */
            1: "https://linkToYourImage1",
            2: myImage /* you can pass images in any form: link, imported via webpack... */
            /* 3: your other image... */
            /* 4: your other image... */
            /* 5: your other image... */
            /* ... */
          }}
          how={130} /* Pass the number of images Sky will render chosing randomly */
          time={40} /* time of animation */
          size={'100px'} /* size of the rendered images */
          background={'palettedvioletred'} /* color of background */
        />
      </div>
    );
  }
}

export default App;

More information at https://github.com/lucagez/sky