Webpage Color Extractor

Extract color values from HTML and CSS to identify the main and supporting colors used by a webpage.

Color Extractor

Webpage color extractor

This color extractor identifies common color formats in HTML attributes, inline style, and CSS, including three- and six-digit HEX, RGB, HSL, and common named colors. Duplicate colors are merged and counted, then exported as a standard HEX palette and CSS custom variables for design recovery, theming, refactoring, and brand analysis.

Multiple formats

Recognize HEX, RGB, RGBA, HSL, HSLA, and selected common names, then normalize to six-digit HEX.

Merge duplicates

Different spellings of the same color become one HEX value with a usage count, making theme colors easier to find.

Export CSS variables

Generate :root variables directly for themes, component styles, and design tokens.

How to use

  1. Paste HTML and CSS from a full page, component fragment, or stylesheet.
  2. Extract colors; the palette is sorted by usage and duplicate HEX values are merged.
  3. Copy a swatch individually or copy and download the complete CSS variables.

FAQ

Is transparency preserved?

The palette normalizes colors to six-digit HEX, so alpha from RGBA or eight-digit HEX is not included in the final value. Keep the original CSS when transparency matters.

Are all named CSS colors supported?

HEX, RGB, and HSL are the primary formats. A common named-color set is included for quick analysis; use HEX or keep the original CSS for uncommon names.

Recommended utilities

You may also need these file utilities