Universal gl-react effect to apply 4x4 rgba color matrix on a content
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
src
.gitignore
.npmignore
README.md
package.json

README.md

gl-react-color-matrix ![](https://img.shields.io/badge/gl--react->= 2.1-05F561.svg)

Universal gl-react color-matrix effect

Props

  • children (required): the content to color-matrix.
  • matrix (required): an array of 16 numbers that represents a 4x4 color matrix (rgba x rgba).

Usage Examples

var ColorMatrix = require("gl-react-color-matrix").ColorMatrix;
// or
import {ColorMatrix} from "gl-react-color-matrix";

Identity

<ColorMatrix matrix={[
  1, 0, 0, 0,
  0, 1, 0, 0,
  0, 0, 1, 0,
  0, 0, 0, 1
]}>
  ...
</ColorMatrix>

Let only RED through

<ColorMatrix matrix={[
  1, 0, 0, 0,
  0, 0, 0, 0,
  0, 0, 0, 0,
  0, 0, 0, 1
]}>
  ...
</ColorMatrix>

Grayscale (approximative)

<ColorMatrix matrix={[
  .3, .3, .3, 0,
  .6, .6, .6, 0,
  .1, .1, .1, 0,
   0,  0,  0, 1
]}>
  ...
</ColorMatrix>