modern-filters

📦 Install

npm i modern-filters

🦄 Usage

import { createTexture, createEmbossFilter, createFadeFilter } from 'modern-filters'

const image = new Image()
image.src = 'example.jpg'
image.onload = () => {
  const texture = createTexture({
    source: image,
    view: document.querySelector('canvas'),
  })

  texture.useFilter([
    createEmbossFilter({ strength: 5 }),
    createFadeFilter({ duration: 1.2 }),
  ])

  // This zero is filter current time of timeline
  texture.draw(0)
  // texture.draw(1)

  // Read image data for current frame
  // texture.readImageData()
}

🚀 Filter creaters

createFilter(options?: Options)

• createAdjustmentFilter
• createBlurFilter
• createColorMatrixFilter
• createColorOverlayFilter
• createEmbossFilter
• createFadeFilter
• createGodrayFilter
• createKawaseBlurFilter
• createMultiColorReplaceFilter
• createPixelateFilter
• createTiltShiftFilter
• createTwistFilter
• createZoomBlurFilter

Types

See the types.ts

Reference

• pixijs/pixijs
• pixijs/filters