How to Change the Colours of an Image (Hue Shift)
Shift every colour in an image around the colour wheel to recolour a logo, icon or product variant, and raise or lower saturation. Free, in your browser.
3 min read ·
To change the colours of an image, open Hue & Saturation, add the picture, move the Hue slider (0–360°) to rotate every colour around the colour wheel, adjust Saturation to make colours stronger or weaker, click Adjust Image!, and download. It's a quick way to make a blue icon green, try a logo in different colours, or create colour variants of a simple graphic.
Change colours step by step
- Open Hue & Saturation and add the image.
- Move Hue: every colour shifts by the same angle around the colour wheel.
- Move Saturation up for stronger colours, down (to −100) to remove colour entirely.
- Click Adjust Image!, check the result, and download.
How the hue slider works
Colours sit on a wheel: red at 0°, yellow at 60°, green at 120°, cyan at 180°, blue at 240° and magenta at 300°. Moving the hue slider rotates all colours by the same amount:
| Hue shift | Red becomes | Blue becomes |
|---|---|---|
| 60° | Yellow | Magenta |
| 120° | Green | Red |
| 180° | Cyan | Yellow |
| 240° | Blue | Green |
Whites, greys and blacks have no hue, so they stay as they are.
What it's good for
- Recolouring single-colour graphics: icons, logos, illustrations and shapes with one main colour change cleanly.
- Product colour variants: a simple product (a mug, a T-shirt mock-up) on a white background can be shown in several colours.
- Design exploration: see a banner or a poster in different colour schemes quickly.
- Creative effects: surreal skies, alien landscapes, psychedelic posters.
- Desaturating: lower saturation fully for a grey version, or partly for a muted look.
What it's not good for
Because the hue slider changes every colour, it doesn't suit photos where you want to change one thing:
- Changing just a car's or a dress's colour in a photo also changes the sky, the grass and the skin. Select the object first in the Photo Editor, which has selection tools and layers.
- Fixing a colour cast (a yellow or blue tint over a whole photo) needs white-balance correction, not a hue rotation. The AI Photo Enhancer corrects colour automatically.
- Matching an exact brand colour: hue rotation gets you close, but not to a precise value. Pick the original colour with the Image Color Picker and calculate the target in the Color Code Converter to judge the shift needed.
Example: three colour versions of an icon
- Add a blue icon (a PNG with a transparent background works best).
- Move Hue to 120° for a red version, download it.
- Move Hue to 240° for a green version, download it.
- Lower Saturation to −100 for a grey "disabled" version.
In a minute you have a consistent set for buttons, status badges or a colour picker in a design.
Saturation: up and down
- Raise for bolder, more graphic colours. For natural photos, the Vibrance Adjuster is gentler on skin tones.
- Lower to calm a busy image, make text over it more readable, or create a muted, faded style.
- All the way down gives a grayscale image.
Inverting instead
For a negative effect — every colour replaced by its opposite, black becoming white — use Invert Colors. That's different from a 180° hue shift: inverting also flips brightness, while hue only changes the colour.
Frequently asked questions
Is my image uploaded?
No. The colours are changed in your browser.
Will transparent areas stay transparent?
Transparency in PNGs is kept, so recoloured icons and logos keep their transparent backgrounds.
Why didn't white parts change colour?
White, grey and black have no hue; only the saturation and hue of coloured areas change.