Professional · Free · No Uploads

The Image Editor
That Runs in Your Browser

A full-featured professional image editor — layers, blend modes, filters, adjustments, selection tools, drawing tools, history, undo/redo, export presets and more. Everything runs locally in your browser. No uploads, no subscription, no limits.

Layers & Blend Modes Adjustments & Filters Selection Tools Drawing Tools History & Undo Multi-Format Export
🖼️

Professional Image Editor

Upload any image — then use the full toolset below to edit, adjust, filter and export at any quality

LayersBlend Modes FiltersAdjustmentsExport
Tools
Adjust
Filters
Canvas
Foreground / Background
Brush Options
Size20px
Hardness80%
Opacity100%
Flow100%
Brush
Transform
Angle
🖼️
Open an image to start editing
Drag & drop any image here, or paste from clipboard. JPG, PNG, WebP, AVIF, GIF, BMP, TIFF supported.
Layers
History
Info
Export
Mode
Opacity 100%
Tool: Move
Size:
Cursor:
Layers: 0
Zoom: 100%
Mode: RGB 8-bit
Complete Feature Set

Everything a Professional Image Editor Should Have

Built on Canvas API with zero server-side processing — all edits happen locally and privately.

Layers & Blend Modes

Full layer stack with 16 blend modes including Multiply, Screen, Overlay, Soft Light and more. Layer groups, opacity control, visibility toggle, duplicate, merge and flatten.

🎨

Adjustments Panel

Exposure, brightness, contrast, highlights, shadows, hue, saturation, lightness, white balance, levels (black/white point, gamma), sharpening, denoise, and vignette.

Creative Filters

Gaussian blur, sharpen, high pass, grayscale, sepia, invert, emboss, posterize, pixelate, chromatic aberration correction, noise reduction, red-eye fix, and B&W mix.

Selection Tools

Rectangular marquee, freehand lasso, polygonal lasso, magic wand with tolerance control, feathering, grow/shrink selection, invert selection, and quick mask mode.

🖌

Drawing & Painting

Brush, pencil, eraser, paint bucket, gradient tool. Six brush types: round, soft, flat, texture, splatter, chalk. Size, hardness, opacity and flow controls.

🔁

Retouching Tools

Clone stamp, healing brush, patch tool, blur/sharpen/smudge brush, dodge and burn tool — all with adjustable size and strength for non-destructive retouching.

💾

Multi-Format Export

Export as JPG, PNG, WebP, AVIF, or BMP with quality control. Four export presets: Web, Print, Social Media, Email. Multi-format batch export in one click.

History & Snapshots

Full undo/redo history panel with named state entries. Save named snapshots of any intermediate state to return to at any point during your editing session.

📊

Histogram & Info

Live RGB histogram display, cursor colour readout with hex and RGB values, image metadata viewer, image dimensions, file size, and colour profile information.

Grid, Rulers & Guides

Toggle ruler overlays, configurable grid with adjustable cell size, guide lines, before/after split view, and full-screen mode for distraction-free editing.

Crop & Transform

Crop by coordinates, resize image with linked proportions, resize canvas independently, rotate by 90° or any fine angle, flip horizontal and vertical.

💧

Watermark & Text

Add text watermarks with position control (corner or centre), opacity setting, and font size. Shape tools for rectangles, circles, lines, and polygon overlays.

📖

The Complete Guide to Browser-Based Image Editing

Understanding layers, adjustments, filters and professional editing workflows — all running in your browser

Why a Browser-Based Image Editor Makes Sense in 2024

Professional desktop image editors have existed for decades and are extraordinarily powerful. But they also cost hundreds of dollars per year on subscription, require gigabytes of installation, run on specific operating systems, and lock your workflow behind vendor-specific file formats. For many image editing tasks — from quick adjustments and social media crops to more involved compositing and filter work — that level of infrastructure is simply unnecessary.

Modern browsers have become remarkably capable runtime environments. The HTML5 Canvas API provides pixel-level read and write access to image data. WebGL enables GPU-accelerated compositing. The FileSystem API allows reading and writing local files. The Clipboard API supports direct image paste and copy operations. The result is that a browser can today run image editing workflows that would have required dedicated software just five years ago — all without installing anything, signing in anywhere, or uploading your images to any server.

Everything processed by this tool happens within your browser's memory on your own device. Your images are never transmitted anywhere. This makes browser-based editing not just convenient but genuinely private — the right choice for sensitive images, client work, confidential documents, or any situation where you cannot afford the risk of image data leaving your control.

How the Canvas API Makes This Possible

The HTML5 Canvas element is essentially a bitmap drawing surface that JavaScript can write to directly. When you load an image into our editor, it is decoded by the browser's native image decoder and drawn onto a canvas element — giving us access to every individual pixel as an array of RGBA values. Adjustments like brightness and contrast are applied by mathematically transforming those RGBA values. Filters like blur and sharpen are applied through convolution operations on the pixel array. The result is then encoded back to an image file and offered for download.

This is the same fundamental approach used by desktop image editors — the difference is that it runs inside the browser's JavaScript engine rather than as compiled native code. Modern JavaScript engines (V8 in Chrome, SpiderMonkey in Firefox) are fast enough that these operations complete in milliseconds on typical-sized images.


Understanding Layers and Blend Modes

Layers are the foundation of non-destructive image editing. Instead of permanently altering your original image when you make an adjustment, you work on separate layers stacked on top of each other. The original image stays intact on its own layer at the bottom of the stack. Your edits, additions, and adjustments live on separate layers above it. At any time you can hide a layer to see the image without that change, delete a layer to permanently remove an edit, or reorder layers to change how they interact.

The 16 Blend Modes Explained

Blend modes determine how each layer's pixels combine with the pixels of the layers beneath it. The default blend mode is Normal — the upper layer simply covers the lower layer at its opacity setting. The other 15 blend modes perform mathematical operations between the pixel values:

  • Multiply — darkens the result by multiplying pixel values. Any white becomes transparent; black stays black. Perfect for adding shadows or darkening regions.
  • Screen — the inverse of Multiply, lightens by inverting, multiplying, then inverting again. Black becomes transparent; white stays white. Great for adding highlights and glows.
  • Overlay — combines Multiply and Screen: dark areas darken further, light areas lighten further, preserving contrast while increasing it. Popular for adding texture to images.
  • Soft Light — similar to Overlay but gentler and more subtle. Excellent for colour grading and tonal adjustments.
  • Color Dodge / Color Burn — extreme lightening and darkening modes respectively, useful for stylised effects and creative retouching.
  • Difference / Exclusion — produce inverted or reduced-contrast results based on the mathematical difference between layers. Useful for comparing images and alignment.
  • Hue / Saturation / Color / Luminosity — separate and recombine the different components of colour independently. "Color" preserves the hue and saturation of the upper layer while using the luminosity of the lower layer — the most useful of the four for colour grading.

Colour Adjustments: What Each Slider Actually Does

The adjustment panel in our editor contains a comprehensive set of colour and tonal controls. Understanding what each one does at a technical level helps you use them purposefully rather than guessing.

Exposure, Brightness, and Contrast

Exposure simulates the effect of physically increasing or decreasing camera exposure — it scales all pixel values proportionally. The effect is similar to brightness but applies more naturally to photographic images because it mimics how light actually works. Brightness adds or subtracts a fixed amount from all pixel values, which can clip highlights and shadows if pushed too far. Contrast spreads pixel values apart (increase) or closer together (decrease) around the midpoint — increasing contrast makes light areas lighter and dark areas darker simultaneously.

Highlights and Shadows

These controls affect only the lightest and darkest pixels in the image respectively, leaving the midtones relatively unchanged. Pulling down highlights recovers detail that was close to burning out. Pulling up shadows reveals detail in dark areas without brightening the overall exposure. Used together, they compress the tonal range — reducing the difference between the lightest and darkest parts of the image — which is a key step in the professional "look" achieved in high-end landscape and portrait photography.

White Balance: Temperature and Tint

White balance describes the colour of the light illuminating the scene. Daylight is relatively blue; tungsten light is orange-yellow; fluorescent light has a greenish cast. Temperature corrects the blue-to-orange axis: moving it warmer adds yellow-red and removes blue (correcting a cold, bluish cast). Tint corrects the green-to-magenta axis. Correct white balance makes neutral objects — white walls, grey cards, clouds — appear genuinely neutral rather than tinted by the light source.

Levels: Black Point, White Point, and Gamma

The levels controls set the input range of the image. The black point tells the editor what value should be considered "black" — moving it up forces all values below that threshold to pure black, which increases apparent contrast and richness. The white point does the same at the other end. Gamma controls the midtone brightness without affecting the black or white points — a gamma above 1.0 brightens midtones, below 1.0 darkens them.


Selection Tools: Isolating Parts of an Image

Selection tools allow you to isolate a region of the image so that subsequent edits, adjustments, and filters only affect the pixels inside the selection. This is one of the most powerful concepts in image editing — the ability to apply different adjustments to different parts of the same image.

Marquee Selection

The simplest selection tool — draws a rectangular (or square with Shift held) selection box. Best for cropping to a specific region before export, or applying an adjustment to a clearly rectangular area such as a sky or a product background.

Lasso and Polygonal Lasso

The freehand lasso lets you draw any irregular selection by dragging. The polygonal lasso lets you click corner points to create a selection made of straight line segments — better for objects with defined edges like buildings, furniture, and geometric shapes. Both require a closed path to complete the selection.

Magic Wand

The magic wand performs a flood-fill selection starting from the pixel you click, expanding to include all neighbouring pixels within the specified tolerance of the original click colour. Low tolerance selects only pixels very similar in colour to the clicked pixel; high tolerance selects a broader range. The magic wand is the fastest way to select large areas of uniform colour — backgrounds, skies, solid product backgrounds — that would take minutes to trace manually.

Feathering Selections

Feathering adds a soft fade to the selection boundary — instead of a hard edge where selected and unselected pixels are completely separate, a feathered selection creates a gradual transition zone. Adjustments applied to a feathered selection blend naturally with the surrounding image, avoiding the unnatural hard edges that make amateur retouching obvious. A feather radius of 10–20 pixels is typically sufficient for smooth, natural-looking results.


Export Formats and When to Use Each

Choosing the right export format is as important as the edits themselves. Using the wrong format can dramatically increase file size, reduce quality, or cause compatibility problems on the platforms where the image will be used.

  • JPEG: The universal standard for photographs. Lossy compression produces small files. No transparency support. Use for any photographic image that needs to work everywhere — social media, email, web, print. Quality 80–90 is the right range for most uses; quality 95+ for final deliverables and print preparation.
  • PNG: Lossless compression with full transparency support. Larger files than JPEG for photographs, but perfect for images with text, sharp edges, logos, icons, and anything you plan to edit further. The right choice when quality loss is unacceptable.
  • WebP: Google's modern web format offering better compression than both JPEG and PNG with transparency support. 95%+ browser support. The best choice for web delivery in 2024 when maximum compatibility is not required.
  • AVIF: The most efficient format available, based on the AV1 codec. Produces smaller files than WebP at equivalent quality, with full transparency and HDR support. Around 80% browser support. Best for modern web projects targeting current browsers.
  • BMP: Uncompressed bitmap format. Enormous file sizes but pixel-perfect quality and universal compatibility for Windows environments. Only choose BMP when the receiving application specifically requires it.

Non-Destructive Editing with the History Panel

The history panel records every action you take during an editing session — each brush stroke, each adjustment, each filter application. Every entry in the history list represents a complete state of the image at that moment. Clicking any history entry instantly restores the image to that exact state, allowing you to explore different editing directions and compare results.

Snapshots go one step further by saving a named version of the image at a particular point in your workflow. Unlike the regular history which scrolls away as you add more steps, snapshots persist until you explicitly delete them. Use snapshots to mark important milestones: the original unedited image, the state after basic adjustments, the state after detailed retouching, and so on. This gives you checkpoint you can always return to, no matter how many additional edits you make after saving the snapshot.

The combination of layers, history, and snapshots forms the foundation of non-destructive editing — a workflow philosophy where the original image data is never permanently destroyed. You can always go back, you can always try again, and you can always see the before and after of any change.