Get the colours from a website.

How to do it today

Palettae reads images, and a screenshot is an image. That turns out to be a perfectly good way to get a site’s palette, and in one respect a better one than reading its stylesheet: you get the colours as they actually appear, at the proportions they actually appear in, rather than every colour the CSS happens to define.

1. Take a screenshot of the page. A full-page capture is better than a viewport one — it catches the footer and any second section.
2. Paste it straight onto this page. No need to save the file first.
3. Set the palette to 8 or 10. Websites usually have more distinct colours than a photograph does.
4. Use the picker for anything specific — a button fill, a link colour, one border.

What a screenshot tells you that CSS doesn’t

Prominence. A stylesheet will list a dozen greys with no indication of which one carries the page. The screenshot tells you that one grey is 62% of what a visitor sees and the other eleven are rounding errors. That is usually the thing you wanted to know.

What it doesn’t tell you

Colours that are not on screen: hover and focus states, dark mode if you captured light, anything below a fold you did not capture, and the exact value behind a semi-transparent overlay. For those, the browser’s developer tools are the right instrument.

Reading a palette straight from a URL

Pulling colours from a site’s CSS, its backgrounds and its theme-color is a genuinely different feature from reading an image, and Palettae does not do it yet. When it does, it will be honest about which colours came from a stylesheet and which from a render — those are different claims. In the meantime the screenshot route above gets you the same answer, and often a more useful one.

You can, though, paste the URL of a single image — the image URL field on the tool takes a direct link to a JPG, PNG or WEBP.