The difference between a quick edit and a mess you cannot undo is usually not the tool, it is the habits. Almost every photo editor, from a full desktop suite to the photo editor in your browser, is built on the same few ideas: layers, opacity, blend modes and a history you can step back through. This guide explains each in plain terms with the numbers behind them, then gives a short routine that keeps a picture easy to change next week.
What a layer is
Think of a stack of transparent sheets laid over your photo. The photo is on the bottom sheet. A second sheet might hold a line of text, a third a hand-painted highlight. You see all the sheets at once, but you can move, hide or change any one without touching the others. That is the whole point of layers: a change on its own sheet is a change you can take back.
The order matters. A sheet higher in the list covers the ones below it wherever it has paint. Moving a layer up or down in the list changes which one wins; moving the layer with the move tool changes where it sits on the canvas. In the editor, the layer list shows the top layer first, and the eye button next to each layer hides it without deleting anything.
Opacity: how much of the sheet shows
A layer's opacity runs from 0% (invisible) to 100% (fully there). At 50%, each pixel of the layer is mixed half and half with whatever is below. The arithmetic is a plain weighted average: result = layer × opacity + below × (1 − opacity). A white pixel (255) over a mid-grey pixel (128) at 50% gives (255 + 128) / 2 = about 192.
Use opacity for softness: a texture laid lightly over a photo, a watermark that should not shout, a "before" copy you want to compare against.
Blend modes: how the colours combine
Normal blending just covers what is below. A blend mode changes the maths, so the layer's colours interact with the picture instead of hiding it. Write each colour as a number from 0 to 255, take a photo pixel of 200 as the base and a layer pixel of 100 on top:
- Multiply multiplies the two and divides by 255: 200 × 100 / 255 = 78. The result is never lighter than either input. White (255) leaves the base unchanged; black gives black. Use it for shadows, to tint a photo with a colour wash, or to darken a sky by painting a soft grey layer.
- Screen is the mirror image: 255 − (255 − 200) × (255 − 100) / 255 = 222. The result is never darker than either input; black changes nothing. Use it for glows, light leaks, lens flares, a soft sunrise glow.
- Overlay multiplies the dark parts and screens the light parts, so it adds contrast while keeping colour. With a base of 200 (a light pixel) it screens: 255 − 2 × (255 − 200) × (255 − 100) / 255 = 188. A mid-grey layer (128) changes next to nothing, which makes overlay perfect for dodging and burning: fill a layer with mid grey, set it to overlay, then paint white softly to brighten and black softly to darken.
- Darken keeps the darker of the two (100 here). Lighten keeps the lighter (200 here). They are useful for painting only over areas that are lighter or darker than the brush colour.
You can see all of this live in the editor: add a blank layer, paint a soft stroke, then switch the blend mode and watch the same stroke change character.
A routine that keeps a photo easy to change
- Keep the original untouched. Open the picture and duplicate its layer before doing anything else. Work on the copy; hide it any time to compare with the original underneath.
- Crop and resize first. Everything after that works on fewer pixels, so it is faster and the effects are sized for the final picture. For crops, see cropping to the right aspect ratio.
- Fix tone before colour. Brightness and contrast, or auto levels, first; then saturation or hue. Changing exposure after you have tuned the colour tends to undo the colour.
- Paint and add text on their own layers. Never paint on the photo layer. A blank layer above it holds retouching, another holds text. If you dislike the retouch, delete that layer, not the photo.
- Use a selection to limit a change. Select a rectangle, then paint, fill or adjust: pixels outside it cannot change, so a bold adjustment cannot spill onto the face you just fixed.
- Sharpen last, and lightly. Sharpening exaggerates the edges that exist; do it once, on the final size, after every other edit. A little goes a long way: halos around edges are the giveaway of too much.
- Merge only when you are sure. Merging down or flattening combines layers into one. It can be undone while the history lasts, but not after you close the picture, so keep a copy of the layered version.
Saving: master and delivery
Keep two files. The master is the last version you can still edit. A browser editor does not save its layers to a file, so the safest master is a PNG of the flattened picture at full size, plus the original photo; if you want to keep working on layers later, finish in one sitting. The delivery file is what you share: JPG for photographs, PNG for graphics, text and anything with transparency, WebP when you control the page and want smaller files. JPG, PNG and WebP explains the trade-offs, and compressing images without losing quality covers how far to push the quality slider.
One more habit before you share: photos can carry hidden location data. Re-saving from an editor draws the picture fresh, which drops most metadata, but check with the image toolkit or read how to remove GPS location from photos if privacy matters.
Limits worth knowing
A browser editor is the right tool for quick, well-defined jobs: a caption, a brightness fix, a composite of two pictures, a cleaned-up thumbnail. It does not replace a desktop suite for large retouching projects: it has no healing brush, no curves or masks, no RAW or PSD files and no colour profiles, and a very large picture uses a lot of your device's memory. Knowing where the edge is saves time: do the quick job here, and reach for heavier software only when the job truly needs it.