How do I find the colors of a website?

Type or paste the website address, for example stripe.com, and click Get colors. The tool reads the public page and its stylesheets, counts how often each color is used and where, and shows the brand colors with Main, Accent, Background and Text labels. Click any color for its HEX, RGB and HSL codes.

Where do the colors come from?

Only from public files any browser downloads: the CSS stylesheets, style tags and style attributes of the page, the theme-color meta tag, the web app manifest and the site logo or app icon. Colors are weighted by use, so a color on buttons, links and the header counts more than one used once in a footer. Because pages often load third-party widgets such as chat boxes or cookie banners, a few of their colors can show up too.

Why are some colors missing or different from what I see on the site?

Some sites paint their colors with JavaScript after the page loads, put them inside photos and videos, or show different colors to logged-in visitors or in dark mode. The tool only sees the public HTML and CSS. For those sites, take a screenshot and drop it into the Logo / screenshot tab - that reads the exact pixels you see.

What do Main, Accent, Background and Text mean?

Main is the most-used brand color, matched to the site theme color when there is one. Accent is the next strong color with a clearly different hue. Background is the color the page body sits on, and Text is the body text color. White, black and grays are listed apart as Neutrals so they do not crowd out the brand colors.

Which export format should I use?

Use Figma variables or Adobe ASE for design apps, Procreate swatches on iPad and GIMP GPL for GIMP, Inkscape and Krita. Developers can copy CSS variables, SCSS, Tailwind or JSON. The PNG card is handy for sharing, and Everything (ZIP) bundles all formats with a README. The real file size is shown before you download.

Website Color Palette Extractor - Find the Brand Colors of Any Website

Try:

Every website has a favorite color. Paste an address above and we'll find out which.

Neutrals in exportOff - only the brand colors are saved OFF

Adobe ASEFind some colors first

How to find the brand colors of a website

Enter a website. Type or paste a website address such as stripe.com, or switch to Logo / screenshot and drop an image.

Get the colors. Click Get colors. The brand colors appear with Main, Accent, Background and Text labels, plus neutrals and logo colors.

Copy the codes. Click a color to copy its HEX, RGB or HSL code, or send it to the Color Wheel, Contrast Checker or Gradient Generator.

Export the palette. Choose a format - Figma, Adobe ASE, Procreate, CSS, Tailwind, PNG and more - and download it or copy the code.

Only need the site icon? The Favicon Extractor downloads it in every size.

How the colors are found

We load the page the way a browser would and read its public CSS - linked stylesheets, <style> tags, style attributes and CSS variables. Every color is counted along with where it is used.

Weighted by use

Buttons, links, headers and --primary style variables count more than a color used once in a footer.

Brand signals

The theme-color tag, the Safari pinned-tab color and the web app manifest are strong hints for the main color.

Logo check

The site logo or app icon is measured too, so you can see which brand colors also live in the logo.

Near-identical shades are merged in the OKLab color space, and white, black and grays go to a separate Neutrals list.

An honest note about the results

Public CSS only. Colors painted by JavaScript, or living inside photos and videos, are not in the stylesheet. A screenshot in the Logo / screenshot tab catches those.

Third-party widgets. Chat bubbles, cookie banners and embedded players bring their own CSS, so one or two of their colors can appear.

Sites that say no. We respect robots.txt and skip sites that block automated visitors - and we never read private network addresses.

A 24-hour memory. Results are cached for a day so repeat lookups are instant and websites aren't hit twice. Use Look it up again later for fresh colors.

What to do with brand colors

Check readability. Test text on each brand color with the Contrast Checker, or the whole palette at once with the Accessible Color Palette.

Build a full scale. Turn the main color into tints and shades with Color Shades, or find matching colors on the Color Wheel.

Make a hero background. Blend the main and accent colors in the Gradient Generator.

Recolor a design. Swap one color for another across a whole stylesheet with the CSS Color Editor.

Need ideas instead? Browse ready-made Color Palettes or get one from any photo with the AI Color Palette.

Frequently Asked Questions

Type or paste the address - for example stripe.com - and click Get colors. The tool reads the public page and its stylesheets and counts how often each color is used, and where.

You get the brand colors with Main, Accent, Background and Text labels. Click a color for its HEX, RGB and HSL codes.

Only from public files any browser downloads: the stylesheets, <style> tags and style attributes, the theme-color tag, the web app manifest and the logo or app icon.

Colors are weighted by use - a color on buttons, links and the header counts more than one used once in a footer. Pages often load third-party widgets (chat boxes, cookie banners), so a few of their colors can show up too.

Some sites paint their colors with JavaScript after loading, put them inside photos and videos, or change them for logged-in visitors and dark mode. The tool only sees the public HTML and CSS.

For those sites, grab a picture with Website Screenshot and drop it into the Logo / screenshot tab - it reads the exact pixels you see.

Main is the most-used brand color, matched to the site theme color when there is one. Accent is the next strong color with a clearly different hue.

Background is what the page body sits on and Text is the body text color. White, black and grays are listed apart as Neutrals.

Yes. Open the Logo / screenshot tab and drop, paste (Ctrl+V) or browse for a PNG, JPG, WEBP, GIF, SVG or AVIF file. The colors are measured in your browser - nothing is uploaded.

Want to pick one exact pixel instead? Use the Image Color Picker.

Some sites block automated visitors, ask bots to stay away in their robots.txt file, answer too slowly or need a login. We also never read private or local network addresses.

In every case the Logo / screenshot tab still works with a screenshot of the page.

Design apps: Figma variables, Adobe ASE, Procreate or GIMP / Inkscape. Code: CSS variables, SCSS, Tailwind or JSON - copy or download.

The PNG card is handy for sharing, and Everything (ZIP) bundles all formats with a README. The real file size is shown before you download.

Free, no account. To stay fast and polite to websites, the colors found for an address are cached for 24 hours. Images you drop in the Logo / screenshot tab never leave your browser - see our Privacy Policy.

Brand colors can be part of a trademark, so use them for reference, mockups and matching.

Website Color Palette

Brand colors 0

Neutrals 0

Logo colors