@imgsolve/compress-image-to-100kb

A dependency-free browser utility that compresses JPEG, PNG, or WebP images to 100 KB or less. It searches for the best practical encoder quality and reduces image dimensions only when quality adjustment is not enough.

Installation

npm install @imgsolve/compress-image-to-100kb

Usage

import { compressImageTo100KB } from "@imgsolve/compress-image-to-100kb";

const input = document.querySelector("input[type=file]");

input.addEventListener("change", async () => {
  const compressedBlob = await compressImageTo100KB(input.files[0]);
  console.log(`Compressed size: ${compressedBlob.size} bytes`);

  const url = URL.createObjectURL(compressedBlob);
  const link = document.createElement("a");
  link.href = url;
  link.download = "compressed-100kb.jpg";
  link.click();
  URL.revokeObjectURL(url);
});

To receive a downloadable File with an automatically generated filename:

import { compressImageFileTo100KB } from "@imgsolve/compress-image-to-100kb";

const outputFile = await compressImageFileTo100KB(inputFile, {
  type: "image/webp",
  maxWidth: 1920,
  maxHeight: 1080
});

Options

• type: image/jpeg (default) or image/webp
• maxWidth: optional maximum output width
• maxHeight: optional maximum output height
• minQuality: lowest encoder quality; default 0.08
• maxQuality: highest encoder quality; default 0.95
• attempts: quality-search attempts per image size; default 9

The package treats 100 KB as 102,400 bytes. Browser encoders and image content vary, so visual quality and final dimensions depend on the source image.

Compress an image online

Need a ready-to-use tool without writing code?

Compress an image to 100KB with ImgSolve

Browser support

This package requires a modern browser with Canvas, Blob, File, and createImageBitmap support. It is not intended for direct Node.js processing.

License

MIT