Linktotem

Color palette generator

Tap Generate (or press the space bar) for a new palette, lock the colours you want to keep and generate again until it feels right. Pick a colour harmony, start from one of 12 ready palettes, or upload a photo to get its main colours. Copy any colour as HEX, RGB or HSL, and take the whole palette as CSS variables, a Tailwind theme or a PNG. Free, and it all happens in your browser.

  • Free
  • No sign-up
  • From a photo or a harmony
  • HEX, RGB, HSL, CSS, Tailwind, PNG
Colour harmony

A different harmony each time, from light to dark.

Ready palettes

Give your link in bio your colours

A Linktotem page can wear this palette: the background, text, buttons and icons each get the colour that suits them, checked so everything stays readable. Pick a light or a dark page above and see it on the right.

  • Your palette is waiting for you when you sign up
  • Colours placed for you, with readable text guaranteed
  • Fine-tune any colour later in the design panel

Build and publish free, no card. No ads on your page.

How to use it

  1. 1

    Generate

    Tap Generate or press the space bar. Each palette runs from a dark colour to a light one, so there is always something to write with and something to write on.

  2. 2

    Lock what you like

    Tap the padlock on the colours you want to keep and generate again: only the others change, and they are built around the ones you locked.

  3. 3

    Or start from a photo

    Upload a photo — your logo, your shop, your feed — and get its main colours in order of how much of the picture they cover.

  4. 4

    Take it with you

    Copy a colour as HEX, RGB or HSL, or the whole palette as a list, CSS variables or a Tailwind theme, or download it as a PNG.

What a colour palette is for

A palette is the short list of colours a brand uses everywhere: on the website, the Instagram feed, the logo, the packaging and the link in bio. Keeping to a few colours is what makes things look designed rather than put together, and it makes every new post or page faster to make, because the choices are already made.

Most brands need three to five colours: a light one for backgrounds, a dark one for text, a main colour that is recognisably theirs, and one or two accents for buttons and highlights. The generator always spreads its colours from dark to light for that reason.

Colour harmonies, simply

Colour harmonies are combinations that work because of where the colours sit on the colour wheel. Analogous colours are neighbours, like orange, coral and pink: calm and natural. Monochrome is one hue in several shades: simple and elegant. Complementary colours face each other, like blue and orange: strong contrast that makes buttons pop. Split complementary and triadic mix three hues for livelier palettes that still feel balanced.

Lock a colour you already have — your logo's, say — and every harmony is built around it.

Getting a palette from a photo

Upload a photo and the tool finds its main colours by grouping similar pixels and ranking the groups by how much of the picture they cover. It works well with a photo of your products, your shop, a place that inspires you or your best-performing post. The picture is read by your browser and never uploaded anywhere.

Photos often give muted colours. If you want more life, lock the ones you love and generate the rest, or nudge a colour with its picker.

HEX, RGB and HSL

They are three ways of writing the same colour. HEX (#0f766e) is what most design apps, website builders and Canva ask for. RGB (15, 118, 110) gives the amounts of red, green and blue. HSL (175°, 77%, 26%) describes the hue, how saturated it is and how light — handy for making a lighter or darker shade of a colour by changing only the last number. Tap any code to copy it.

Readable colours

A beautiful palette can still be hard to read. For each colour, the tool shows the contrast of black and white text on it; a tick means it meets 4.5:1, the accessibility guideline for normal text. Put body text on your lightest or darkest colour, and keep the vivid ones for buttons, icons and headings.

Private by design

Everything runs in your browser. Your palettes and photos are never sent anywhere, and you can use the colours for anything, including client and commercial work.

FAQ

Frequently asked questions

Is this colour palette generator free?

Yes. No sign-up, no limits and no watermark on the PNG. Use the palettes anywhere.

How do I get a colour palette from an image?

Tap “From a photo” and choose a picture. The tool finds its main colours in your browser, largest area first; the photo is never uploaded.

How many colours should a brand palette have?

Three to five is plenty: a light background colour, a dark text colour, a main brand colour and one or two accents. You can make palettes of three to eight here.

Can I keep some colours and change the others?

Yes. Lock the colours you like with the padlock, then generate again — only the unlocked ones change.

How do I use the palette in CSS or Tailwind?

Open Export and pick CSS for :root variables (--color-1 and so on) or Tailwind for an @theme block, then copy and paste it into your stylesheet.

What's the difference between HEX, RGB and HSL?

They write the same colour three ways: HEX as a code (#0f766e), RGB as amounts of red, green and blue, and HSL as hue, saturation and lightness.

How do I know text will be readable on my colours?

Each colour shows how black and white text read on it. A tick means a contrast of at least 4.5:1, the accessibility rule for normal text.

More free tools

See all free tools

Linktotem

One link for everything you do

Your WhatsApp, Instagram, TikTok, shop and bookings on one page with your look — the link you put in your bio. Build it in minutes and publish it free, with no ads.

No card needed to publish. Upgrade or cancel any time.

Claim your link today

One link for everything you create, sell and share. Free to publish, online in minutes.