Image Converter — TypeScript source

Convert images between PNG, JPEG and WebP entirely in your browser. Batch-friendly with quality control and a before/after size delta — nothing is uploaded.

This is the TypeScript implementation — the same logic the interactive tool runs, in a shareable, citable form.

Open the interactive tool →

// Image converter — display snippet. The live tool batches this pipeline in
// the browser; canvas-bound, so no Go twin.
export async function convertImage(
  file: File,
  target: 'png' | 'jpeg' | 'webp',
  quality = 0.85,
): Promise<Blob> {
  const bitmap = await createImageBitmap(file);
  const canvas = document.createElement('canvas');
  canvas.width = bitmap.width;
  canvas.height = bitmap.height;
  const ctx = canvas.getContext('2d')!;
  if (target === 'jpeg') {
    // JPEG has no alpha channel; flatten onto white or it renders black.
    ctx.fillStyle = '#ffffff';
    ctx.fillRect(0, 0, canvas.width, canvas.height);
  }
  ctx.drawImage(bitmap, 0, 0);
  return new Promise<Blob>((resolve, reject) =>
    canvas.toBlob(
      (b) => (b ? resolve(b) : reject(new Error('encode failed'))),
      `image/${target}`,
      quality,
    ),
  );
}

Also available in 8 other languages

Every CosmoDev tool ships its pure logic in TypeScript (web) and Go (CLI), with authored implementations in a dozen-plus languages — the same contract, ported. Compare all languages side by side →