2.1.0 • Published 3 years ago

canvas-tint-image v2.1.0

Weekly downloads
4
License
MIT
Repository
github
Last release
3 years ago

canvas-tint-image

npm version stability-stable npm minzipped size dependencies types Conventional Commits styled with prettier linted with eslint license

A one trick pony package to tint an image with a canvas 2D context.

paypal coinbase twitter

npm.io

Installation

npm install canvas-tint-image

Usage

import canvasTintImage from "canvas-tint-image";
import getCanvasContext from "get-canvas-context";
import AsyncPreloader from "async-preloader";

const context = getCanvasContext("2d", {
  width: 100,
  height: 100,
});

(async () => {
  const image = await AsyncPreloader.loadImage({ src: "image.jpg" });
  context.drawImage(tintImage(image, "#f00", 0.5), 0, 0);
})();

API

canvasTintImage(image, color, opacity) ⇒ HTMLCanvasElement

Tint an image with a canvas 2D context.

Kind: global function

ParamTypeDefaultDescription
imageCanvasImageSourceThe image to tint
colorstring | CanvasGradient | CanvasPatternA CSS value
opacitynumber0.5Opacity of the tint between 0 and 1

License

MIT. See license file.

2.1.0

3 years ago

2.0.1

3 years ago

2.0.0

3 years ago

1.0.1

4 years ago

1.0.0

6 years ago