Change Color Hue

What this tool does

You have a colour, and you want a different colour that shares its feel, the same depth and the same intensity, but sits somewhere else on the spectrum. Maybe you need a green to match the mood of a blue you already have, or a set of colours that are equally vivid but spread across the wheel. What you want is to change which colour it is while keeping everything else the same.

That is what this does. You give it a colour and say how far to shift its hue, and it returns the result with its saturation and lightness untouched. It rotates the colour around the wheel to a new hue, which is the clean way to find a related colour that carries the same weight and vividness as the one you started with.

How to use it

1. Enter your colour. Type or paste your colour, then set how far to shift its hue, in degrees around the wheel.
2. Read the new colour. The tool shows the shifted result beside your original, with a swatch and its codes.
3. Copy what you need. Take the new colour in whichever format your work requires.

Use a small shift for a closely related colour or a larger one to move well across the wheel, adjusting until the new hue is where you want it.

How it works

The tool reads your colour as hue, saturation, and lightness, and rotates the hue by the number of degrees you set, going round the colour wheel. The saturation and the lightness are left exactly as they are, so how vivid and how light the colour is do not change; only which colour it is moves. The rotation is handled by TinyColor, which spins the hue and returns the result.

Because only the hue moves, the new colour keeps a clear relationship to the old one. You are not making it lighter, darker, bolder, or duller; you are stepping it around the wheel to a different colour at the same brightness and intensity. That is why the result feels like a natural counterpart to your original rather than an unrelated pick.

What hue means

Hue is the property that tells you which colour something is, red, orange, yellow, green, blue, and so on. It is measured as an angle from 0 to 360 degrees around a colour wheel, where 0 is red, 120 is green, and 240 is blue, with every other colour falling somewhere along the circle between them.

Because the hues form a full circle, moving through them is a rotation, and after 360 degrees you arrive back where you started. Hue is only one of a colour's three properties: it fixes the colour, while saturation fixes how vivid it is and lightness fixes how light or dark. Keeping hue separate like this is what lets a tool change which colour you have without altering how strong or how light it is.

How shifting the hue works

Shifting the hue means turning that angle around the wheel by a set number of degrees. Your colour holds its saturation and its lightness, so it stays just as vivid and just as light, but it lands on a new colour further round the circle. A small shift moves you to a neighbouring colour, a nearby cousin, while a larger one carries you to a colour on the far side of the wheel.

Since the wheel wraps around, the shift always lands on a real colour, and the size of the shift decides how related the result feels. A gentle turn keeps the new colour close to the original, useful for subtle variety, while a big turn gives you a strong contrast that still shares the original's weight and intensity, because only the hue has moved.

Why change a colour's hue

A common reason is building a set of colours that belong together. If you shift one colour's hue by even steps around the wheel, you get several colours that all share the same vividness and lightness, which makes them feel like a matched family. That is the idea behind many colour schemes, where the relationships between hues do the work.

It is also useful for finding a colour with a particular mood but a different identity. You might love how deep and rich a certain colour is and want the same treatment in a different colour, and shifting the hue gives you exactly that. Whenever you want to keep a colour's character but change which colour it is, rotating its hue is the direct way to do it.

How far to shift the hue

The size of the shift is really a choice about how much contrast you want. Small shifts, a short way round the wheel, give closely related colours that sit near each other and blend easily, which suits gentle variety within a scheme. It is worth trying a modest shift first and seeing how far from the original it takes you.

Larger shifts create stronger contrast, and certain angles are especially useful: a shift of about 180 degrees lands on the colour opposite yours on the wheel, its natural counterpart, while shifts near 120 degrees give the evenly spaced trios that many balanced schemes use. There is no wrong amount, since every angle is a real colour, so the guide is simply how closely or how boldly you want the new colour to relate to the one you started with.

Questions people ask

How do I change a colour's hue?

Enter the colour, set how far to shift its hue in degrees, and the tool rotates it around the wheel and returns the result. Your original stays visible for comparison.

Does shifting the hue change how light or vivid the colour is?

No. Only the hue moves, so the saturation and lightness stay the same, giving a new colour at the same brightness and intensity as your original.

What is hue?

Hue is which colour something is, red, green, blue, and so on, measured as an angle from 0 to 360 degrees around a colour wheel. Shifting it rotates to a new colour.

What shift gives the opposite colour?

A shift of about 180 degrees lands on the colour directly across the wheel, your colour's natural counterpart, while smaller shifts give more closely related colours.

References

1. World Wide Web Consortium (W3C), CSS Color Module Level 4. https://www.w3.org/TR/css-color-4/
2. Hue, the attribute that names a colour. Wikipedia. https://en.wikipedia.org/wiki/Hue
3. TinyColor (Brian Grinstead). Documentation. https://github.com/bgrins/TinyColor