🌏 Translated with the assistance of DeepSeek and ChatGPT

Pixelate

The component library exports a pixelateImage function that pixelates images. Pass in a URL, base64 string, or <img> element, and it returns the pixelated ImageData object. You can use the component library's imageDataToDataURL function to convert it to a base64 format string for direct use in <img> tags.

Basic Usage

Hide source code

API

function pixelateImage(imageSource: string | HTMLImageElement, pixelSize: number, options?: {
    palette?: string[];
    background?: string;
}): Promise<ImageData | null>

options.palette restricts the available palette after pixelation, and options.background is the reference background color for the distance between contrasting colors when transparency is involved, defaulting to #FFF, with the alpha channel being ignored.

For the format of these two parameters, see Supported Color Parsing.