Static editor · Adjustments · 2 min read

Adjust hue and saturation

Shift every color in your mockup, make it more or less vivid, or tint the whole picture in one hue.

Open Hue / Saturation

With your mockup open in Static, click Hue / Saturation in the right panel. It has three sliders, Hue, Saturation and Lightness, and a Colorize switch. All start at 0.

The Hue / Saturation section with Hue, Saturation and Lightness at 0 and Colorize offThe Hue / Saturation section with Hue, Saturation and Lightness at 0 and Colorize off
Three sliders and a Colorize switch.

Shift the hue

Click the number next to Hue, type 60 and press Enter. Every color moves around the color wheel: the purple background turns brownish red and the green rings turn purple and aqua.

Hue at 60 with the background turned brownish red and the rings turned purple and aquaHue at 60 with the background turned brownish red and the rings turned purple and aqua
Hue moves all colors together.

Raise the saturation

Set Saturation to 40. The colors get stronger: the background becomes a vivid red-orange. Negative values mute them instead.

Saturation at 40 with the background a vivid red-orangeSaturation at 40 with the background a vivid red-orange
Saturation makes the colors more vivid.

Try Colorize

Turn on Colorize. The whole picture is painted in the single hue you set, with the light and dark areas kept. Turn it off again to go back to the full colors.

Colorize on with the whole picture in shades of greenColorize on with the whole picture in shades of green
Colorize paints everything in one hue.

Questions

What does the Hue slider do?

It moves every color around the color wheel together. In this guide Hue 60 turns a purple background brownish red.

How do I make colors more vivid or more muted?

Raise Saturation for stronger colors, for example 40. Negative values mute them.

What does Colorize do?

It paints the whole picture in the single hue you set and keeps the light and dark areas. Turn it off to go back to the full colors.

Is there a gentler way to lift colors?

Yes. The Vibrance section below has its own Vibrance and Saturation sliders.

Try it in the Static mockup editor

Photo mockups in the browser: drop a design in, export a picture.

Open editor