All Projects → dabanlee → Blurify

dabanlee / Blurify

Licence: mit
blurify.js is a tiny(~2kb) library to blurred pictures, support graceful downgrade from `css` mode to `canvas` mode.

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Blurify

Gaussianblur
An easy and fast library to apply gaussian blur filter on any images. 🎩
Stars: ✭ 473 (-28.87%)
Mutual labels:  image, blur, canvas
Pixelate
Pixelate an image with canvas.
Stars: ✭ 78 (-88.27%)
Mutual labels:  image, canvas
Jspaint
🎨 Classic MS Paint, REVIVED + ✨Extras
Stars: ✭ 5,972 (+798.05%)
Mutual labels:  image, canvas
Filterous 2
Instagram-like photo manipulation library for Node.js and Javascript on browser
Stars: ✭ 163 (-75.49%)
Mutual labels:  image, canvas
Html To Image
✂️ Generates an image from a DOM node using HTML5 canvas and SVG.
Stars: ✭ 595 (-10.53%)
Mutual labels:  image, canvas
Color.js
Extract colors from an image (0.75 KB) 🎨
Stars: ✭ 42 (-93.68%)
Mutual labels:  image, canvas
Fabric Photo
基于canvas的前端图片编辑器
Stars: ✭ 132 (-80.15%)
Mutual labels:  image, canvas
Instagrid Js
A Javascript library to do exactly what Instagram Layout application does
Stars: ✭ 13 (-98.05%)
Mutual labels:  image, canvas
Picasso
Picasso is a high quality 2D vector graphic rendering library. It support path , matrix , gradient , pattern , image and truetype font.
Stars: ✭ 205 (-69.17%)
Mutual labels:  image, canvas
Fediagram
图说前端>>收集各种前端技术图谱 🚕🚖🚗🚚🚛🚜
Stars: ✭ 273 (-58.95%)
Mutual labels:  image, canvas
Localresizeimg
🔥 前端本地客户端压缩图片,兼容IOS,Android,PC、自动按需加载文件
Stars: ✭ 3,135 (+371.43%)
Mutual labels:  image, canvas
Compress.js
A simple JavaScript based client-side image compression algorithm
Stars: ✭ 86 (-87.07%)
Mutual labels:  image, canvas
Stackblur Go
A fast, almost Gaussian Blur implementation in Go
Stars: ✭ 189 (-71.58%)
Mutual labels:  image, blur
Imaging
Imaging is a simple image processing package for Go
Stars: ✭ 4,023 (+504.96%)
Mutual labels:  image, blur
Tui.image Editor
🍞🎨 Full-featured photo image editor using canvas. It is really easy, and it comes with great filters.
Stars: ✭ 4,761 (+615.94%)
Mutual labels:  image, canvas
Handright
A lightweight Python library for simulating Chinese handwriting
Stars: ✭ 634 (-4.66%)
Mutual labels:  image
Miblurpopup
MIBlurPopup lets you create popups with a blurred background
Stars: ✭ 598 (-10.08%)
Mutual labels:  blur
Gameplane
基于Android的仿微信打飞机游戏
Stars: ✭ 592 (-10.98%)
Mutual labels:  canvas
Oblique
With Oblique explore new styles of displaying images
Stars: ✭ 633 (-4.81%)
Mutual labels:  image
React Force Graph
React component for 2D, 3D, VR and AR force directed graphs
Stars: ✭ 589 (-11.43%)
Mutual labels:  canvas

blurify

npmsize

blurify.js is a tiny(~2kb) library to blur pictures, with graceful downgrade support from css mode to canvas mode.

Installation

$ npm i blurify

DEMO

Demo

Usage

blurify(options)

blurify the images with given options:

  • images { Element }, blurify target elements.
  • blur { Int }, extent of blur, defaulting to 6.
  • mode { String }, mode of blurify.
    • css: use filter property.(default)
    • canvas: use canvas export base64.
    • auto: use css mode firstly, otherwise switch to canvas mode by automatically.
import blurify from 'blurify';

new blurify({
    images: document.querySelectorAll('.blurify'),
    blur: 6,
    mode: 'css',
});

// or in shorthand

blurify(6, document.querySelectorAll('.blurify'));

License

Licensed under the MIT License

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].