Image Hue

Change image hue: rotate colours or tint a whole picture

Hue is the “which colour” part of a colour — red, orange, green, blue — measured as an angle around the colour wheel. Shifting it turns a red car blue, a green logo purple or a summer scene autumnal. The image hue tool rotates every colour in a picture by any angle from −180° to +180°, or, in Colorize mode, paints the whole image in a single tint while keeping its light and shade.

You choose how the rotation is calculated: classic HSL, perceptual OKLCH that keeps brightness steady, or the matrix behind CSS hue-rotate() when you need to match a website. The preview has a before/after split and a live histogram, and batches are processed at full resolution on your device and saved as a ZIP.

How to use the Image Hue

1. Drop, browse or paste the images you want to recolour.
2. In Rotate hue mode, drag Hue shift or type an angle. 120° moves reds to greens, greens to blues and blues to reds.
3. Pick a Colour model; OKLCH is best when the result must keep the same apparent brightness.
4. For a single-colour look, switch to Colorize and set the tint hue, its saturation and the strength.
5. Check the split preview and download, or press Download all as ZIP.

Image Hue features

The colour wheel in degrees

Hue angles follow the standard colour wheel used by HSL, HSV and CSS. Adding an angle moves every colour the same distance round the circle:

How each colour model rotates hue

• HSL: each pixel is converted to hue, saturation and lightness, H′ = (H + shift) mod 360, and converted back. Saturation and HSL lightness are kept exactly, but perceived brightness can change: a yellow rotated to blue looks much darker even though its HSL lightness is the same.
• OKLCH: works in the OKLab perceptual space, rotating the hue angle while lightness L and chroma C stay fixed, so rotated colours keep their apparent brightness. When a rotated colour falls outside the sRGB gamut, its chroma is reduced until it fits instead of clipping channels, so the hue stays true.
• CSS hue-rotate(): the 3 × 3 matrix from the W3C Filter Effects specification, built from the cosine and sine of the angle around the luminance axis. It matches browsers exactly, but it is an approximation: large angles change saturation and can clip.

Colorize: one hue for the whole image

Colorize ignores the original hues. For every pixel it takes the luma Y′ = 0.2126 R + 0.7152 G + 0.0722 B as the lightness and builds a new colour from your tint hue and saturation in HSL, then mixes it with the original by the Strength percentage. A hue around 30–40° with 30–40% saturation gives a warm, print-like tone; 200–220° gives a cool blueprint look. For classic sepia and duotone presets, see Sepia Image.

Tips and common mistakes

• Hue rotation changes every colour at once, skin included. Small shifts of ±5–15° can correct a slight tint; large ones are creative effects.
• Greys and pure black or white cannot be recoloured by rotation because they have no hue — use Colorize instead.
• To make colours stronger or weaker rather than different, use Image Saturation.
• A 180° shift is not a negative: light and dark stay where they are. For a true negative use Invert Image.
• Read exact colour values from the result with the image colour picker.