react-backgrounds v0.30.0

React-Backgrounds

Geometric Backgrounds built with React.js

View the demo, or check out the project on GitHub and NPM

Installation

In the terminal:

npm install react-backgrounds --save-dev

In your JS:

import Iris from 'react-backgrounds';
...
ReactDOM.render(
    <Iris shapeCount={50} colors={['#b71a49','#006b94']} />,
    document.getElementById('react-bg')
);

In your HTML:

<div id="react-bg"></div>;  

Configuration/Options

shapeCount={...}

This attribute specifies the number of shapes that will be created. Currently, this must always be set -though I am working on creating a default 'random' generator.

colors={'...','...',...}

You can use any color combination that you want. Simply supply the colors as an array of comma separated strings inside the 'colors' attribute. Colors will be rendered in the order in which you supply them. This defaults to #000000.

opacity={...}

Set the opacity of the shapes. This defaults to .1.

Examples

harry-anderson.github.io