Pixel perfect… ou presque

// bun run web/app/themes/my-theme/assets/config/images.ts | pbcopy

const ratios = ['3:2', '5:6', '16:9', '21:9', '1:1', 'original'];
const widths = [30, 256, 384, 690, 750, 828, 1080, 1400, 1920, 2048, 3840];
const formats = ['jpg', 'webp', 'avif'];

const imageStyles: string[] = [];

for (const ratio of ratios) {
  for (const width of widths) {
    for (const format of formats) {
      if (ratio === 'original') {
        imageStyles.push(`          [
            'name' => 'original_${width}_${format}',
            'width' => ${width},
            'height' => 9999,
            'crop' => false,
          ],`)
      } else {
        const [w, h] = ratio.split(':').map(Number);
        imageStyles.push(`          [
            'name' => '${w}_${h}_${width}_${format}',
            'width' => ${width},
            'height' => ${Math.round(width*h/w)},
            'crop' => true,
          ],`)
      }
    }
  }
}

for (const style of imageStyles) {
  console.log(style);
}

$ magick in.jpg -scale 640 -colorspace Gray -ordered-dither h4x4o -colorspace sRGB -opaque black out.png