How to Crop & Convert TIFF to ICO: Step-by-Step Tutorial
🚀 Follow along with the tool open. TIFF to ICO Crop Converter — free, in your browser.
Open Tool →Overview
This tutorial walks through every step of cropping a TIFF image and converting it to a multi-resolution ICO file using the Data Conversion Center TIFF to ICO Crop Converter. The output ICO contains 16×16, 32×32, and 48×48 pixel variants — the three sizes expected by Windows and web browsers for favicons and application icons. 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/tiff-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 TIFF
You have two options for loading your source image:
- Drag and drop. Drag a TIFF file (with a
.tiffor.tifextension) from your file manager directly onto the drop zone. 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 TIFF 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: Crop to a Square Icon Region
ICO images are always square — 16×16, 32×32, and 48×48 are all 1:1 aspect ratios. For the sharpest output, select a square crop region containing just the icon subject. Here is how to use the handles:
- Corner handles (NW, NE, SW, SE). Drag to resize the crop in both dimensions simultaneously. Start by dragging inward from a corner to exclude surrounding whitespace or background.
- Edge handles (N, S, W, E). Drag to trim a single side without affecting the opposite edge. Use these for fine-tuning after a rough crop with the corner handles.
- Interior pan. Click and drag inside the rectangle to reposition the selection without changing its size. Useful for re-centring after resizing.
Watch the crop dimensions badge in the panel header as you drag. Aim for equal width and height values — for example, 512 × 512 px or 256 × 256 px — to ensure the icon subject fills the square cleanly without distortion. The tool accepts non-square crops too, but the output will be stretched to fit the 16×16, 32×32, and 48×48 square dimensions.
Step 4: Preview the Crop
Before downloading, click Preview Crop. A pop-up opens showing the cropped region at browser width. The title displays the output dimensions. Verify:
- The icon subject is well-centred and fills most of the frame.
- No important detail is clipped at the edges.
- The selection is approximately square (equal width and height in the badge).
Close the preview with the × button or by clicking outside the modal, then adjust handles if needed.
Step 5: Convert & Download the ICO
When you are satisfied with the crop, click Convert & Download ICO. The button briefly shows "⏳ Converting…" while the tool:
- Draws the selected pixel region onto three separate off-screen canvases, each downscaled to 16×16, 32×32, and 48×48 pixels respectively.
- Reads the RGBA pixel data from each canvas.
- Encodes each size as a 32-bit DIB (Device-Independent Bitmap) with an XOR mask and AND mask, the standard payload for ICO image entries.
- Writes the ICONDIR header and ICONDIRENTRY directory, appends the three DIB payloads, and packages everything into a binary ICO ArrayBuffer.
- Creates a Blob URL for the file and triggers a browser download.
The file downloads as [original-filename]_crop.ico. For a source file named logo.tiff, the output is logo_crop.ico. No server round-trip occurs at any point.
Step 6: Use the ICO as a Favicon
To use the downloaded ICO as a website favicon, place it in your web root and add the following to your HTML <head>:
<link rel="icon" href="/favicon.ico" sizes="48x48">
Modern browsers also prefer SVG favicons or PNG at specific sizes. The ICO format is the most compatible fallback and is required for Internet Explorer and some legacy environments.
Step 7: Start Over (Optional)
To crop and convert a different TIFF, click ↺ Start Over. This clears the current image, resets the crop handles, and returns the tool to its initial drop zone state.
Tips for Best Results
- Crop square for crisp icons. Matching width and height in the crop dimensions badge before converting produces icons that are not stretched or squashed at 16×16 and 32×32.
- Use a high-resolution source. TIFF files are ideal ICO sources precisely because they are high-resolution. Starting from at least 256×256 pixels of source content gives the downscaler maximum detail to work with at 16×16.
- Simple subjects work best at small sizes. At 16×16 pixels, fine detail disappears. The best favicon subjects are bold, simple shapes — a single letter, a geometric mark, or a high-contrast symbol.
- Transparency is preserved. The tool uses 32-bit ARGB encoding for each ICO image entry, so alpha channel transparency from your TIFF crop carries through to the output.
✍ Ready to crop and convert your TIFF to ICO?
Open TIFF to ICO Crop Converter →