image-q is an advanced image quantization library for Node.js and the browser. It provides various algorithms for color quantization and dithering, allowing you to reduce the number of colors in an image while maintaining visual quality.
Color Quantization
This feature allows you to reduce the number of colors in an image using various quantization algorithms. The code sample demonstrates how to load an image, create a quantizer instance, and quantize the image.
const { ImageQuantizer, Palette } = require('image-q');
const fs = require('fs');
// Load an image (example uses a buffer from a file)
const imageBuffer = fs.readFileSync('path/to/image.png');
// Create a quantizer instance
const quantizer = new ImageQuantizer();
// Quantize the image
quantizer.quantize(imageBuffer).then((result) => {
// Save the quantized image
fs.writeFileSync('path/to/quantized_image.png', result);
});Dithering
This feature allows you to apply dithering to an image, which helps to reduce color banding and improve visual quality. The code sample demonstrates how to load an image, create a ditherer instance, and apply dithering to the image.
const { ImageDitherer } = require('image-q');
const fs = require('fs');
// Load an image (example uses a buffer from a file)
const imageBuffer = fs.readFileSync('path/to/image.png');
// Create a ditherer instance
const ditherer = new ImageDitherer();
// Apply dithering to the image
const ditheredImage = ditherer.dither(imageBuffer);
// Save the dithered image
fs.writeFileSync('path/to/dithered_image.png', ditheredImage);Palette Extraction
This feature allows you to extract the color palette from an image. The code sample demonstrates how to load an image, create a palette instance, and extract the palette colors from the image.
const { Palette } = require('image-q');
const fs = require('fs');
// Load an image (example uses a buffer from a file)
const imageBuffer = fs.readFileSync('path/to/image.png');
// Create a palette instance
const palette = new Palette();
// Extract the palette from the image
palette.buildPalette(imageBuffer).then((paletteColors) => {
console.log('Extracted Palette:', paletteColors);
});quantize is a library for color quantization using the MMCQ (Modified Median Cut Quantization) algorithm. It is lightweight and easy to use for reducing the number of colors in an image. However, it lacks the advanced dithering and palette extraction features provided by image-q.
color-thief is a library for extracting the dominant color or a palette of colors from an image. It is designed to be simple and efficient, but it does not offer the same level of customization and advanced features as image-q, such as dithering and multiple quantization algorithms.
Complete Image Quantization Library in TypeScript (MIT License)
Image Color Number Reduction with alpha support using RGBQuant/NeuQuant/Xiaolin Wu's algorithms and Euclidean/Manhattan/CIEDE2000 color distance formulas in TypeScript
Platforms supported
API
Builds
dist/cjs/image-q.js - CommonJSdist/esm/image-q.js - ESM (ESNext)dist/cjs/image-q.js - UMDImport
HTMLImageElementHTMLCanvasElementNodeCanvasImageDataArrayCanvasPixelArrayUint8ArrayUint32ArrayColor Distance
Euclidean - 1/1/1/1 coefficients (originally used in Xiaolin Wu's Quantizer WuQuant)EuclideanBT709NoAlpha - BT.709 sRGB coefficients (originally used in RGBQuant)EuclideanBT709 BT.709 sRGB coefficients + alpha supportManhattan - 1/1/1/1 coefficients (originally used in NeuQuant)ManhattanBT709 - BT.709 sRGB coefficientsManhattanNommyde - see https://github.com/igor-bezkrovny/image-quantization/issues/4#issuecomment-234527620CIEDE2000 - CIEDE2000 (very slow)CIE94Textiles - CIE94 implementation for textilesCIE94GraphicArts - CIE94 implementation for graphic artsCMetric - see http://www.compuphase.com/cmetric.htmPNGQuant - used in pngQuant toolPalette Quantizers
NeuQuant (original code ported, integer calculations)NeuQuantFloat (floating-point calculations)RGBQuantWuQuantImage Quantizers
NearestColorErrorDiffusionArray - two modes of error propagation are supported: xnview and gimp
FloydSteinbergFalseFloydSteinbergStuckiAtkinsonJarvisBurkesSierraTwoSierraSierraLiteErrorDiffusionRiemersma - Hilbert space-filling curve is usedOutput
Uint32ArrayUint8Arrayimage-q library into your project// will import ESM (ESNext) or UMD version depending on your bundler/node
import * as iq from 'image-q';
var iq = require('image-q');
<script
src="<path-to image-q/dist/umd/image-q.js>"
type="text/javascript"
charset="utf-8"
></script>
Please refer to API Documentation and Usage
+ PaletteQuantizer#quantize => PaletteQuantizer#quantizeSync
+ ImageQuantizer#quantize => ImageQuantizer#quantizeSync
+ EuclideanRgbQuantWOAlpha => EuclideanBT709NoAlpha
+ EuclideanRgbQuantWithAlpha => EuclideanBT709
+ ManhattanSRGB => ManhattanBT709
+ IImageDitherer => AbstractImageQuantizer
+ IPaletteQuantizer => AbstractPaletteQuantizer
+ PointContainer.fromNodeCanvas => PointContainer.fromHTMLCanvasElement
+ PointContainer.fromArray => PointContainer.fromUint8Array
+ PointContainer.fromBuffer (Node.js, new)
+ CMETRIC => CMetric
+ PNGQUANT => PNGQuant
+ SSIM Class => ssim function
+ Test cases for different types of imports and requres added
+ Try to solve exported bundle types problem. 'umd' bundle removed.
+ Test case for issue #95 added
+ Fixes #96: Fix minimumColorDistanceToDither (PR #97 by @pixelplanetdev)
+ Fixes #95: "Always empty result in certain webpack / babel configs" (PR #98)
+ Fixes issue "Module not found: Can't resolve 'core-js/fn/set-immediate' in ..."
+ pnpm monorepo, esbuild for faster builds, typescript upgraded
+ Basic (Simple) API implemented
+ see breaking changes
+ @types/node moved to 'dependencies'
+ documentation added
+ some refactorings/renames, see breaking changes
+ circular dependency removed
+ readme updated
+ progress tracking api (using es6 generators) added
+ strinct lint rules (+code cleanup/renames)
+ rollup (3 different versions - umd, cjs, esm + source maps + d.ts)
+ latest TypeScript
+ jest
+ snapshot tests
+ coverage (+coveralls)
+ greenkeeper
+ CIEDE2000 - incorrect calculation fixed
+ CIEDE2000 - alpha channel now has only 25% impact on color distance instead of 66%
+ CIE94 - added 2 types (textiles and graphics art) according to spec
+ CIE94 - alpha support added
+ rgb2xyz, lab2xyz, xyz2rgb, xyz2lab - gamma correction
+ lab2xyz, xyz2lab - refY should be 100 (1.00000) instead of 10 (0.10000)
+ manhattan with new (Nommyde) coefficients added
+ mocha tests added
+ webpack integration
+ image-q is now UMD module
+ travis-ci integration
+ typescript 2.0
+ indentation with 4 spaces
+ Refactoring
+ Riemersma dithering added (Hilbert Curve)
+ Readme.md updated
+ build.cmd updated
+ NeuQuant is fixed (again) according to original Anthony Dekker source code (all values should be integer)
+ Error Diffusion Dithering is now calculates error like XNVIEW
+ Refactoring
+ Documentation generation fixed
+ File name case problem fixed
+ Auto-generated documentation added
+ Refactoring
+ Code cleanup, removed unnecessary files
+ PNGQuant color distance added, need to check its quality
+ CIEDE2000 and CIE94 fixed for use in NeuQuant
+ NeuQuant is fixed according to original Anthony Dekker source code (all values should be integer)
+ Code refactoring and cleanup
* We have some slowdown because of red/green/blue/alpha normalization according to white point per each calculateRaw/calculateNormalized call
+ CIEDE2000 color distance equation optimized (original CIEDE2000 equation is available as class `CIEDE2000_Original`)
+ CMetric color distance fixed
+ Cleanup
+ Draft of CMetric color distance added
+ rgb2xyz & xyz2lab fixed. CIEDE2000 works much better now.
+ CIE94 distance formula added. More investigation is needed.
+ Initial
Thanks to Leon Sorokin for information share and his original RGBQuant!
Palette Quantization Algorithms
JavaScriptTypeScriptJavaScriptJavaScriptCCC#C#GPLv3Image Quantization Algorithms
Color Distance Formulas
DRAFT!Color conversion formulas
Be sure to fix rgb2xyz/xyz2lab. Issue is with strange part of code:
r = r > 0.04045 ? .... Check http://en.wikipedia.org/wiki/Lab_color_space
Image Quality Assessment
Java License: MITOther
FAQs
Image Quantization Library in **TypeScript** *(MIT Licensed)*
The npm package image-q receives a total of 167,845 weekly downloads. As such, image-q popularity was classified as popular.
We found that image-q demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.