Image Tools

How to Crop & Convert JPG to ICO: Step-by-Step Tutorial

By Bill Crawford · March 2026 · 5 min read · Last updated March 10, 2026

🚀 Follow along with the tool open. JPG to ICO Crop Converter — free, in your browser.

Overview

This tutorial walks through every step of cropping a JPG image and converting it to an ICO file using the Data Conversion Center JPG to ICO Crop Converter. The entire process takes under two minutes and requires no software installation. Your image never leaves your device.

Step 1: Open the Tool

Navigate to dataconversioncenter.com/image-tools/jpg-to-ico-crop/ in any modern browser. The tool works in Chrome, Firefox, Edge, and Safari on both desktop and mobile. No sign-in, no extension, and no download required.

Step 2: Load Your JPG

You have two options for loading your source image:

Drag and drop. Drag a JPG or JPEG file from your file manager directly onto the drop zone in the tool. The file loads the moment you release it.
Browse. Click anywhere on the drop zone (or the "Browse Files" link) to open your operating system's file picker. Select your JPG and click Open.

As soon as the image loads, it appears in the source panel. The blue crop handles appear at the corners and edges of the image, initially set to the full image boundary.

Step 3: Adjust the Crop Area

The crop overlay has eight handles: four at the corners and four at the midpoints of each edge. Here is how each type behaves:

Corner handles (NW, NE, SW, SE). Dragging a corner handle resizes the crop in both dimensions simultaneously. This is the most common handle for creating a square crop — drag the bottom-right corner while watching the dimensions badge to achieve equal width and height.
Edge handles (N, S, W, E). Dragging an edge handle resizes only the dimension perpendicular to that edge. The north and south handles change height only; west and east change width only.
Interior pan. Clicking and dragging anywhere inside the crop rectangle (not on a handle) moves the entire selection without resizing it. Use this to reposition after setting the size.

The crop dimensions badge in the top-right corner of the source panel updates in real time as you drag, showing the output pixel dimensions. For a favicon, aim for a square value such as 256×256, 128×128, 64×64, or 32×32.

Step 4: Preview the Crop

Click the Preview Crop button. A modal window opens showing the exact pixels that will be in the output ICO. The modal title displays the output dimensions. Review the preview carefully:

Is the main subject centered and filling the frame?
Are the edges clean — no unwanted content cropped into the edge?
Does the composition read clearly at the displayed size?

If you are not satisfied, close the preview and adjust the handles. The preview is non-destructive — it does not modify the crop selection.

Step 5: Download the ICO

Click Convert & Download ICO. The tool performs the following operations entirely in your browser:

Draws the cropped region from the original JPG onto an off-screen canvas at full native resolution.
Encodes the canvas as a lossless PNG.
Wraps the PNG data in a valid ICO container (6-byte header + 16-byte directory entry + PNG bytes).
Triggers a browser download named [original-filename]_crop.ico.

The download begins automatically. No file is sent to a server at any point in this process.

Step 6: Use Your ICO File

Once downloaded, here are the most common uses for your new ICO file:

Website favicon. Rename to favicon.ico, upload to your site root, and add <link rel="icon" href="/favicon.ico"> to your <head>. Most browsers find it automatically if it is in the root.
Windows desktop shortcut icon. Right-click a shortcut → Properties → Change Icon → Browse to your .ico file.
Electron app icon. Reference the .ico file in your package.json or main.js as the win32 icon asset.

Starting Over

To convert another image, click Start Over. This resets the drop zone and clears all state. No page reload is needed.

Troubleshooting

Image does not load. Ensure the file is a .jpg or .jpeg. PNG, WebP, and other formats are not accepted by this tool — use the appropriate tool from the Image Tools section for those formats.
Crop handles are not visible. Try zooming out your browser (Ctrl/Cmd + −) so the source panel is larger. On small screens, the panel may be narrow enough that handles cluster together.
Downloaded file does not show as an icon. Some systems cache icon databases. On Windows, open the folder in File Explorer — it may take a moment for the thumbnail to generate. If it still shows a generic file icon, try right-clicking → Properties → Change Icon to manually assign it.
Very large JPG is slow to load. The tool processes files entirely in RAM. If you have a very large source JPG (50 MP+), allow a few seconds for decoding. The conversion step itself is fast once the image is loaded.

📚 Want deeper background on the ICO format and cropping best practices?

Read the Complete Guide →