Image Crop

Crop one image in your browser with a draggable crop box, numeric fields, ratio presets, and format-aware export.

Click or drag an image file here

PNG, JPEG, WebP · Max 10MB
Crop
Controls
Original size-
Output size-
Crop box-
Format-
Choose an image to begin
-

Image Crop

This tool crops a single PNG, JPEG, or WebP image directly in your browser. Drag or resize the crop box, choose a ratio preset, or type exact pixel coordinates.

The original file stays on your device. Canvas export preserves PNG, JPEG, or WebP when the browser supports that output format, and falls back to PNG if needed.

Use freeform crop for arbitrary selections or ratio presets such as 1:1, 4:3, and 16:9 for predictable social, thumbnail, and document sizes.

How to use

  1. Upload one PNG, JPEG, or WebP image.
  2. Drag the crop box, resize it from the handles, choose a ratio preset, or type exact crop values.
  3. Adjust JPEG/WebP quality, preview the output, then download the cropped image.

When to crop images

Crop images to remove unwanted edges, focus on the subject, or fit fixed aspect ratios for cards, thumbnails, and social previews.

Use exact numeric fields when a design or CMS requires a specific pixel crop.

Crop with Canvas

The browser workflow uses source coordinates in Canvas drawImage:

const canvas = document.createElement('canvas');
canvas.width = crop.width;
canvas.height = crop.height;
const ctx = canvas.getContext('2d');
ctx.drawImage(image, crop.x, crop.y, crop.width, crop.height, 0, 0, crop.width, crop.height);
canvas.toBlob(saveBlob, outputMime, quality);

MCP integration

MCP (Model Context Protocol) lets AI agents and apps discover and run Coding.Tools utilities for repeatable conversions, formatting, hashing, and generation workflows.

MCP tool name: image-crop

MCP endpoint: https://coding.tools/mcp

Call tools/list first. Each tool entry includes inputSchema, outputSchema, and examples so an AI agent or client can build valid arguments without guessing.

For tools/call, read result.content[0].text for the display value and result.structuredContent for machine parsing. Tool-level failures return isError: true; protocol failures return a JSON-RPC error.

Example tools/call request:

curl -s https://coding.tools/mcp \
  -H "Content-Type: application/json" \
  -H "Accept: application/json" \
  -H "MCP-Protocol-Version: 2025-06-18" \
  -d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"image-crop","arguments":{}}}'

This image tool is browser-only in MCP. tools/call returns isError: true plus a resource_link to the web UI instead of processing local image bytes on the server.

Most text and data tools accept an input string plus optional options. Browser-only image tools are listed for discovery and return a web UI link when they need browser image APIs.