Skip to main content
Utilnivo

Image workflow

Optimize images for a website

Heavy images slow down pages and hurt Core Web Vitals. This workflow trims backgrounds when needed, fits images to your layout, shrinks file size, and exports modern WebP for browsers that support it.

Remove backgrounds, resize for layout, compress, and convert to WebP for faster page loads.

  • 6 steps
  • About 12 minutes
  • Data stays on this device
  • Updated 2026-07-24
Copy & customize

Workflow

Steps to complete

Work through each step in order. Progress is saved in this browser. Utilnivo does not save uploaded files permanently between tools.

Progress: 0 of 6 steps complete (0%)

  1. Convert HEIC source (optional)

    HEIC to JPG

    Convert iPhone HEIC photos to JPG before resizing when your source files are not already JPG or PNG.

    • On your device
    • Basic conversion
    • No signup
    • Stays on your device
    Open HEIC to JPG
  2. Remove background

    Remove Background

    Cut out the subject when you need transparency or a clean product shot.

    • AI-powered
    • On your device
    • No signup
    • Stays on your device
    Open Remove Background
  3. Resize

    Resize Image

    Match pixel dimensions to how the image appears on your page.

    • On your device
    • No signup
    • Stays on your device
    Open Resize Image
  4. Compress

    Image Compressor

    Lower file weight while keeping acceptable visual quality.

    • On your device
    • No signup
    • Stays on your device
    Open Image Compressor
  5. Convert to WebP

    Image Format Converter

    Export WebP (or JPG) for faster delivery to modern browsers.

    • On your device
    • Basic conversion
    • No signup
    • Stays on your device
    Open Image Format Converter
  6. JPG fallback (optional)

    WebP to JPG

    Export JPG when a platform rejects WebP in uploads or email attachments.

    • On your device
    • Basic conversion
    • No signup
    • Stays on your device
    Open WebP to JPG

Track progress

Your progress

0 of 6 complete (0%). Your progress is saved in this browser.

Printable step list with checkboxes—generated on your device.

Results

Overall output

What you entered and what each step produced appear here. Values used in the next step are passed when supported. Data stays in this browser only.

Run each step and submit the calculator form. Key results will appear here as a connected summary.

Progress: 0 of 6 steps marked complete (0%).

When to use this workflow

  • Product photos need a clean transparent or white background.
  • Hero or blog images are wider than your content column.
  • Lighthouse or PageSpeed flags oversized image payloads.
  • You want WebP versions alongside JPG fallbacks.

Tips

Tips for better results

  • Skip background removal for photos that already have a clean backdrop.
  • Resize to the maximum display width on your site—do not upload 4000 px images for a 800 px slot.
  • Compare WebP and JPG quality on a test page before bulk converting.

FAQ

Frequently asked questions

Is background removal required?

No. Use it for product shots, portraits, or logos on busy backgrounds. Skip it for full-bleed photography.

Do these tools run locally?

Resize, compress, and convert run on your device. Background removal uses an on-device model cached on your device—images are not uploaded or stored.

What size should I resize to?

Resize to the largest width the image displays at, multiplied by 2× for retina screens if you want extra sharpness. A 400 px wide column often needs an 800 px asset.

Keep going

Create social media images

Image

Resize for YouTube, LinkedIn, Facebook, and Instagram with dedicated tools, then bulk compress.

5 steps

  1. YouTube thumbnail
  2. LinkedIn banner
  3. Facebook cover
  4. Instagram sizes
  5. Bulk compress

Prepare a PDF for email

PDF

Organize pages, shrink file size, add a watermark, and sign before you attach a PDF.

4 steps~8 minConnected shell

  1. Organize pages
  2. Compress
  3. Add watermark
  4. Sign