Utilore

Colour Palette Generator

Pick a starting colour and the tool works out the rest of the set by the colour wheel. Click any swatch to copy its code, or drop in a photo and take the palette straight from it.

Scheme

Click a swatch to copy its code

    Palette from a photo

    The photo never leaves your device — it is read straight in the browser.

      How to use

      1. Type a colour code or open the picker — the palette redraws as you choose.
      2. Switch schemes: complementary sits opposite on the wheel, a triad splits it in three.
      3. Click a swatch to copy the code, or copy the whole set as CSS variables.
      4. To take colours from a photo, choose an image — it is read on your device.

      Good to know

      Where the angles come from

      A colour scheme is not a matter of taste but of geometry on the colour wheel. The complementary colour sits exactly opposite, at 180°; a triad divides the circle into three equal parts of 120°; analogous colours are neighbours within thirty degrees. The tool rotates the hue while keeping saturation and lightness, so the companions stay as bright and as deep as the colour you started from.

      Why a photo gives real colours, not mud

      Counting the most frequent pixels does not work on a photograph: the sky alone holds a million slightly different blues, each appearing once. This tool splits the colour space in half along its widest channel and repeats that until it has enough boxes — so the set holds the sky, the face and the shadow separately instead of one average brown.

      Frequently asked questions

      Which scheme should I take for a website?

      Monochrome or analogous are the safe ones: they keep the page calm and never fight for attention. Take a complementary colour for the single element that must be noticed — a button, a badge, a warning.

      How do I use the palette in code?

      Copy the block of CSS variables under the swatches and paste it into your stylesheet. The names come out as --color-1 … --color-6, which is easier to read in someone else's project than a row of hex codes.

      Is my photo uploaded anywhere?

      No. The image is decoded on the page and scaled down to 160 pixels before the colours are counted — nothing leaves the device, and the answer arrives instantly.

      Why does the shades row not end in black?

      Pure black and pure white carry no information — everybody knows them, and in a palette they only take up a slot. The row stops just short of the edge, so every swatch is still a usable colour.

      Related tools