Website color finder: get any site’s color palette
Paste a site to see its background, text and accent colors, and the color variables it defines. Copy them as CSS, as a Tailwind theme, or as a prompt that tells your AI agent to use them.
Backgrounds
Text
Accents
Color variables
More free tools
How it works
- Paste the address of a site whose colors you like.
- We read the page and its stylesheets, then show its main background, text and accent colors, plus the color variables the site defines (with dark mode values when it has them).
- Click any color to copy it, copy the whole palette as CSS variables or a Tailwind theme, or copy a prompt that tells your AI coding agent to use the same colors.
Questions
How do I find out what colors a website uses?
Paste the site’s address above. We read its stylesheets, the same files your browser downloads, and count which colors it uses for backgrounds, text, buttons and links. If the site names its colors with CSS variables, like --primary, you get those names too.
How is this different from the color palette from image tool?
The image palette tool picks colors from pixels in a picture. This one reads the site’s code, so you get the exact colors the designer chose, their names, and dark mode values.
What are accent colors?
Clear, bright colors that aren’t close to black, white or gray. They’re usually the brand color used for buttons, links and highlights.
Which Tailwind version do I have?
If your project has a tailwind.config.js or tailwind.config.ts file, pick v3. If your CSS file starts with @import "tailwindcss"; and there’s no config file, pick v4. Not sure? Copy the prompt for your AI agent instead and it will work it out.
Why are some colors missing?
Some sites add their styles with JavaScript after the page loads, and some block automated visits. Colors inside images and videos aren’t in the code either. We also read up to 12 stylesheets per page. If something looks off, try another page on the same site.