Six Image Tools That Run Entirely in Your Browser

Lossy and Lossless Image Compression

This is the tool that gets used the most, and for good reason. The average smartphone photo in 2025 is between 3 and 8 MB. If you are uploading a batch of 20 product photos to a website, that is potentially 100+ MB of image data before you even think about text content. Our Image Compressor tackles this by using the HTML5 Canvas API — it draws your image onto a canvas element in the browser, then re-encodes it at a lower quality setting. The entire process happens in your browser's memory. Nothing gets uploaded.

In our testing across a few hundred photos, we consistently see 60 to 80% file size reductions with no visible quality loss at default settings. A 5.2 MB iPhone photo of a landscape comes out at around 900 KB to 1.1 MB. A 3.8 MB product shot drops to roughly 700 KB. These numbers vary depending on the image content — photos with lots of detail and texture compress less aggressively than simpler images with smooth gradients and solid backgrounds. But even for complex photos, the reductions are substantial.

The compressor gives you a quality slider, so you are not locked into a single setting. At maximum quality (around 92%), you get smaller files with virtually no perceptible difference. At medium quality (around 75%), the savings are bigger and the quality is still perfectly acceptable for web use. Push it down to 50% and you will start seeing artifacts — slight blurriness around text, banding in gradients, that sort of thing. I would not recommend going below 70% for anything that will be displayed on screen.

The compression ratios sound almost too good, but the math checks out. Most phone photos are saved at 95-98% JPEG quality, which is overkill for screen display. Dropping to 80-85% quality removes data the human eye cannot see anyway, but the file size drops dramatically.

When to use lossy vs. lossless compression:

• Lossy (JPEG/WebP) — Best for photos, web images, email attachments, social media posts. The quality slider lets you find the right balance between file size and visual fidelity. This is what 95% of people need 95% of the time
• Lossless (PNG) — Better for images with text, logos, line art, or anything where pixel-perfect accuracy matters. The savings are smaller (typically 15-30%) because lossless compression cannot discard any visual data, but you get byte-for-byte fidelity to the original

Real-world use cases that come up all the time:

• Website optimization — Every web developer's nightmare is a slow-loading site. Running product images through the compressor before uploading can cut page weight by 50-70% without touching the visual quality. Google's Core Web Vitals scores improve almost immediately
• Email attachments — Most email servers cap attachments at 20-25 MB. If you have a handful of high-res photos to send, the compressor brings them down to a reasonable size without needing a cloud storage link
• Social media uploads — Instagram and Facebook compress your images anyway, but uploading smaller originals means faster uploads and fewer compression artifacts from the platform's own processing
• Document sharing — Screenshots of documents, receipts, and presentations can be massive. Compressing them before sharing via Slack, Teams, or email saves everyone bandwidth and storage

Instant Format Conversion

If you work with images at all, you have run into the format problem. Your designer sends you a PNG with transparency. Your CMS only accepts JPEG. The web developer on your team wants everything in WebP. Your print vendor needs high-resolution BMP. And somewhere in the chain, someone asks if you have an SVG version. Each of these format requirements used to mean opening Photoshop or GIMP, loading the image, exporting in the new format, and hoping the settings were right.

Our Image Converter handles JPEG, PNG, WebP, GIF, BMP, and SVG — six formats that cover practically every scenario I have encountered. You drag your image in, pick your output format, and the browser does the rest. The conversion uses the Canvas API for raster formats and a lightweight SVG parser for vector conversions. It handles batch processing too, so you can drop in 20 PNGs and convert them all to WebP in one go.

Here is why format choice actually matters, because a lot of people treat it as an afterthought:

• WebP — This is the format every web developer wants. It typically produces files 25-35% smaller than equivalent JPEGs with comparable quality. The catch? Not every email client or legacy system supports it yet. Safari only added full WebP support in late 2020, so some older tools still choke on it
• PNG — The go-to for anything that needs transparency (logos, icons, overlays) or pixel-perfect accuracy. The downside is file size — PNGs are almost always larger than JPEGs or WebPs for photographic content because they use lossless compression
• JPEG — The universal workhorse. Supported everywhere, reasonably small files, decent quality. If you are not sure what format to use, JPEG is the safe default for photos
• GIF — Mostly relevant for simple animations or very low-color graphics. For static images, it is almost always inferior to PNG or WebP in both quality and file size
• BMP — Uncompressed, so files are huge. Only useful when a specific system or vendor requires it. I have run into this with older POS systems and industrial equipment interfaces
• SVG — Vector format, infinitely scalable, tiny file sizes for logos and icons. The converter can rasterize SVGs to PNG or JPEG, and it can also embed raster images inside SVG wrappers for specific workflows

The tool also lets you adjust output quality for lossy formats, so a JPEG conversion is not just a blind export — you control the tradeoff between quality and file size. That level of control is missing from most free online converters, which tend to either give you no options at all or bury the settings behind a premium paywall.

Precision Image Resizing

Every social media platform has its own preferred image dimensions, and they change them often enough that keeping track is a part-time job. Instagram wants 1080x1080 for feed posts but 1080x1920 for Stories. YouTube thumbnails need to be exactly 1280x720. LinkedIn banner images are 1584x396. Facebook covers are 820x312. Get any of these wrong and your image gets cropped awkwardly, scaled blurry, or letterboxed with ugly black bars.

Our Image Resizer gives you three ways to set dimensions. You can type in exact pixel values, enter a percentage (like 50% to halve the size), or pick from a dropdown of social media presets. The aspect ratio lock is on by default, so you cannot accidentally stretch or squash your image — but you can turn it off if you actually want to distort the proportions for a specific creative effect.

The resizing engine uses the browser's Canvas API with bilinear or bicubic interpolation depending on whether you are scaling up or down. Scaling down (which is what most people do) produces very clean results. Scaling up will inevitably introduce some softness — that is a mathematical reality, not a bug — but the quality is noticeably better than the nearest-neighbor interpolation that cheaper tools use.

The social media presets alone save me probably 15 minutes a day — no more Googling "YouTube thumbnail size 2025" every time I need to resize an image. The presets include:

• Instagram Post — 1080 × 1080 px (square)
• Instagram Story — 1080 × 1920 px (9:16 portrait)
• Facebook Cover — 820 × 312 px
• Twitter/X Header — 1500 × 500 px
• YouTube Thumbnail — 1280 × 720 px
• LinkedIn Post — 1200 × 627 px
• Pinterest Pin — 1000 × 1500 px (2:3 portrait)
• TikTok Video Cover — 1080 × 1920 px

Beyond social media, the resizer is handy for creating thumbnails (400x300 or 200x150 for grid layouts), resizing profile pictures to meet platform requirements, preparing responsive image sets (you can batch-resize the same image at 1200px, 800px, and 400px widths for srcset attributes), and generating consistent-sized product images for online stores.

Interactive Image Cropping

Cropping seems simple on the surface — you draw a box, you cut. But the tool we built does a few things that the basic crop tools in most image editors skip. First, it offers both free-form cropping (drag any rectangle you want) and fixed-ratio cropping (lock to 16:9, 4:3, 1:1, etc.). Second, it overlays a rule-of-thirds grid on the crop area so you can actually compose your image instead of guessing. Third, it shows you the exact pixel dimensions of your crop in real time, so there are no surprises when you download the result.

The fixed-ratio presets match common use cases: 16:9 for video thumbnails and YouTube, 4:3 for traditional displays and PowerPoint slides, 1:1 for Instagram profile pictures and product images, 3:2 for classic photography proportions, and 9:16 for vertical video covers and Stories. You can also enter a completely custom ratio if none of the presets fit.

One thing I want to be honest about: this is a crop tool, not Photoshop. You are not going to get the kind of non-destructive, layer-based cropping that professional image editors offer. Once you crop and download, the original pixels outside the crop area are gone. Make sure you keep a copy of the original if you think you might need to re-crop later — which, in my experience, you always do.

Common use cases for the cropper:

• Profile photos — Crop a wider photo down to a 1:1 square for LinkedIn, Twitter, or Slack. The grid overlay helps you position your face in the center third
• Social media posts — Crop landscape photos to 4:5 for Instagram feed posts, or to 9:16 for Stories and Reels
• Thumbnail generation — Take a larger image and crop to exactly 1280x720 for YouTube, or 400x225 for blog thumbnails
• Document scanning cleanup — When you photograph a document, the result usually has extra space around the edges. The cropper lets you trim it down to just the document area

Browser-Based OCR with Tesseract.js

This is the tool that surprised me the most in terms of how often people use it. OCR — Optical Character Recognition — has been around for decades, but it used to require either expensive desktop software or uploading your images to a cloud service. Our tool uses Tesseract.js, which is essentially the Tesseract OCR engine (originally developed by HP and later maintained by Google) compiled to JavaScript so it runs directly in your browser via WebAssembly.

What that means in practice: you upload a screenshot of a receipt, a photo of a book page, a scanned document, or any image containing text, and the tool extracts the readable text into an editable field you can copy or download. None of your image data leaves your device. For anyone who has ever needed to digitize text from a physical source, this is genuinely useful.

I need to be upfront about accuracy. With clear, printed text in standard fonts at a reasonable size, we see 90 to 97% accuracy. That covers most screenshots, scanned documents, printed receipts, and textbook pages. The accuracy drops with handwritten text (maybe 70-80% for neat handwriting, lower for messy script), decorative fonts, very small text (below 10px), low-resolution images, or text overlaid on complex backgrounds. It is not going to replace ABBYY FineReader for professional document digitization, but for the vast majority of casual OCR tasks, it works well.

The OCR engine supports multiple languages, including English, Spanish, French, German, Italian, Portuguese, Chinese (Simplified and Traditional), Japanese, Korean, and Arabic. Language detection happens automatically in most cases, but you can also manually select the language if the auto-detection gets it wrong — which happens occasionally with short text snippets or mixed-language content.

A use case I did not expect: people photographing whiteboards after meetings and running the photos through OCR to capture the notes. One project manager told us this saves his team roughly 20 minutes per meeting because nobody has to transcribe the whiteboard content by hand anymore.

Where OCR genuinely shines:

• Digitizing receipts — Photograph your receipts, extract the text, and paste it into a spreadsheet for expense tracking. Way faster than typing each line manually
• Extracting text from screenshots — When someone sends you a screenshot of text (which happens more than it should), OCR lets you grab the actual text instead of squinting at pixels
• Processing scanned documents — If you have a scanner but not a document management system, OCR converts scanned PDFs and images into searchable, editable text
• Students and researchers — Photograph book pages and extract quotes for research papers. Several students told us this cut their note-taking time significantly
• Accessibility — Converting text in images to actual readable text for screen readers and other assistive technologies

Processing time depends on the image size and the amount of text. A typical 1920x1080 screenshot with a paragraph of text processes in 2-4 seconds on a modern laptop. A full-page scanned document at 300 DPI takes 5-10 seconds. The initial language model download (which happens the first time you use the tool and gets cached for subsequent uses) adds a few seconds on first use.

Rotation and Flip Transformations

This is the simplest tool in the set, but it solves a problem that comes up surprisingly often. Phones save photos in the orientation they were taken, but some apps and websites ignore the EXIF rotation metadata and display them sideways or upside down. Scanned documents come out rotated. Photos taken with the camera held at an angle need straightening. And sometimes you just need a horizontal mirror of an image for a layout or design project.

The Rotator/Flipper offers three rotation options and two flip options. You can rotate by 90° (clockwise), 180°, or 270° (which is the same as 90° counter-clockwise). You can flip horizontally (left-right mirror) or vertically (top-bottom mirror). All transformations can be combined — so you can rotate 90° and then flip horizontally in a single operation, for example.

The tool also supports custom angle rotation, which is useful for straightening slightly tilted photos. If you took a photo of a document and it is a few degrees off from horizontal, you can enter something like -3° or +2° to straighten it. The output is re-rendered to a clean rectangle, which means the canvas is slightly larger than the original to accommodate the rotation without cropping the corners.

Everyday situations where this tool gets used:

• Fixing phone photos — The classic problem where a photo looks correct on your phone but appears rotated when uploaded to a website, email, or social media platform
• Correcting scanned documents — Scanner beds rarely align perfectly, and the resulting scans are often slightly rotated. A 1-2° correction makes a huge difference in readability
• Creating mirrored images — Some design layouts need a horizontally flipped version of an image for visual balance. Rather than opening Photoshop, you drop the image in and click "Flip Horizontal"
• Profile picture fixes — When your webcam or phone camera saves a selfie that is not mirrored the way you expect, a horizontal flip fixes it instantly