pixelastic / imoen

Generate base64 blurry placeholders for lazyloading your images.

imoen

Generate base64 blurry placeholders for your images.

Check the online examples.

const imoen = require('imoen');
const filepath = './path/to/file.png');

const { width, height, lqip } = await imoen(filepath);
// <img src="${lqip}" height="${height}" width="${width}" style="filter:blur(5px)" />

// You can call methods individually if you need individual parts
const { width, height } = await imoen.dimensions(filepath)
// This will return a placeholder, as a base64 string
const lqip = await imoen.lqip(filepath);

Documentation

The complete documentation can be found on https://projects.pixelastic.com/imoen/