A free, open source image workbench that runs entirely in the browser. Compress, crop, resize, retouch, and convert images without uploading them to a server.
Use the hosted app at mbianchidev.github.io/img-tools.
- Compress by quality or maximum size — choose an exact quality, or provide a maximum MB target and let the export pipeline tune quality and dimensions.
- Crop, rotate, and mirror — drag and resize the crop frame, use common aspect ratios, or adjust precise edge controls.
- Convert formats — export any browser-readable image to JPG, PNG, or WebP.
- Add text and stickers — browse a complete searchable emoji pack or add a local custom image, then position, rotate, and resize additions.
- Apply effects and filters — adjust light, contrast, color, blur, and vignette.
- Remove backgrounds — clear a connected near-solid background with adjustable tolerance and feathering.
- Blur selected areas — drag and resize rectangular, rounded, or elliptical masks over faces, addresses, or other private details.
- Resize and upscale — export from 10% to 400% with high-quality resampling.
- Add solid backgrounds — fill transparent or removed areas with any color.
- Add watermarks — place a corner mark or tile it across the image.
- Undo and redo — edit non-destructively until download.
Images stay in the current browser tab. There is no backend, upload endpoint, analytics integration, or account system. Closing or refreshing the tab clears the open image and edit history.
Requirements: Node.js 22.22.2 or newer and npm 11 or newer.
git clone https://github.com/mbianchidev/img-tools.git
cd img-tools
npm install
npm run devOpen the URL printed by Vite, normally http://localhost:5173.
docker compose build --no-cache
docker compose upOpen http://localhost:8080. Set IMG_TOOLS_PORT to use another host port:
IMG_TOOLS_PORT=3000 docker compose up- Drop an image on the home page or choose Try the demo image.
- Pick a tool from the left rail. Changes appear in the live preview.
- Drag crop frames, stickers, and blur masks directly on the image. Resize crop and blur masks from any corner, or use the precise controls.
- Choose Export, select JPG, PNG, or WebP, then download the result.
Keyboard shortcuts:
| Action | macOS | Windows/Linux |
|---|---|---|
| Undo | ⌘ Z |
Ctrl Z |
| Redo | ⇧ ⌘ Z |
Ctrl Shift Z |
| Open export | ⌘ E |
Ctrl E |
The current versions of Chrome, Edge, Firefox, and Safari are supported.
- Browser decoding determines which source formats can be opened.
- Animated GIFs are edited as a single frame.
- Custom image stickers accept JPG, PNG, WebP, AVIF, or GIF files up to 20 MB.
- Background removal targets backgrounds connected to the image edge; it is not generative subject segmentation.
- Upscaling uses high-quality resampling and does not invent new detail.
- Very large exports are capped before they exceed common browser canvas limits.
npm run lint # ESLint
npm test # Vitest and Testing Library
npm run build # TypeScript and production bundle
npm run check # all checksThe editor is strict TypeScript with React and the browser Canvas API. See:
Released under the MIT License.