A study of 1,000 home pages, read on October 8, 2026
The colors of the web 2026
49% of the 1,000 most-linked websites have blue as their main color, the median site's CSS holds 113 distinct color values, and 5.9% write a color in OKLCH. Recolor (recolor.page), a website color changer, read the home pages of the most-linked sites in the Majestic Million with its own engine on October 8, 2026: every color in their CSS, how each is written, the light or dark ground of the page and the contrast of its text.
Last updated
results.json, 1,000 sites read on October 8, 2026; how they were read| Measure | Result | Sites |
|---|---|---|
| Main color is blue | 49% | 1,000 |
| Main color is red | 16% | 1,000 |
| Has a blue family at all | 67% | 1,000 |
| Distinct color values in the CSS, median | 113 | 1,000 |
| Colors in use on the page, median | 18 | 1,000 |
| Writes at least one hex code | 99.6% | 996 |
| Writes at least one oklch() color | 5.9% | 996 |
| Reads a color through var() | 82% | 996 |
| Carries Tailwind CSS | 20% | 1,000 |
| Dark page | 6.6% | 1,000 |
| Some text fails WCAG AA | 60% | 963 |
What was measured, and how
The list is the Majestic Million, which ranks domains by how many other networks link to them. Going down it in rank order, the study opened each domain's home page through Recolor, the way anyone loads a site into the app, until 1,000 had loaded: ranks 1 to 1,506, 1,506 domains in all. The other 506 did not count; the most common reasons were these: the home page answered with an error status (170); no answer over HTTPS: no address, a refused connection, a certificate error or a timeout (144); it lands where a higher-ranked site already did (64); robots.txt keeps * or Recolor from the home page (60). The home pages that refused answered 403 most often (93 times), then 404 (20). The fetcher read each site's robots.txt first, asked for the page and the style sheets it links, and ran no scripts, so what was measured is the HTML and CSS the server sends to everyone.
Recolor's engine then read every color in that CSS, merged near-identical values, weighed each by how much of the page it covers, and grouped them into hue families, the way it does before it repaints a page. A site's main color is the family the engine ranks first. The methodology has every definition, and the fetcher's page says what it sends and how to refuse it.
The main colors of the web
Blue is the main color of 49% of the sites, more than every other hue together. Red follows with 16%, then cyan with 5.6% and green with 4.5%; no other hue has more. 3.2% of the sites have no main color at all: their pages are black, white and grey.
Blue is also the most widespread. 67% of the sites have a blue family that holds at least 5% of their color, against 31% for red and 21% for yellow. The main colors are strong ones: the median main color has an OKLCH chroma of 0.177 at a lightness of 0.55, a saturated mid-tone. What colors do most websites use? has the answer on its own page.
Share of sites. The hue buckets are named after the Tailwind CSS v4 shades they are centered on.
The numbers
| Main color | Sites | Share | Hue range (OKLCH degrees) |
|---|---|---|---|
| Red | 164 | 16% | 9.8 to 36.5 |
| Orange | 41 | 4.1% | 36.5 to 66.8 |
| Yellow | 31 | 3.1% | 66.8 to 108.4 |
| Lime | 22 | 2.2% | 108.4 to 140.2 |
| Green | 45 | 4.5% | 140.2 to 166.0 |
| Teal | 22 | 2.2% | 166.0 to 198.9 |
| Cyan | 56 | 5.6% | 198.9 to 237.5 |
| Blue | 490 | 49% | 237.5 to 268.5 |
| Indigo | 41 | 4.1% | 268.5 to 284.9 |
| Violet | 33 | 3.3% | 284.9 to 307.4 |
| Magenta | 13 | 1.3% | 307.4 to 338.2 |
| Pink | 10 | 1% | 338.2 to 9.8 |
| No main color | 32 | 3.2% | black, white and grey only |
How many colors a site uses
The median site's CSS holds 113 distinct color values; half of the sites write between 58 and 189. Most of them are shades of a few colors. Merged where they lie within 0.04 of each other in OKLab and counted only where they reach an element, the median home page uses 18 colors, 9 of them more than a grey, in 3 hue families. Greys carry 73% of the color on the median page, weighed by what each color covers. The spread is wide: 8.4% of the sites write fewer than 25 values, 4.6% write 400 or more, and the most is 1,085.
How many colors does a website use? shows the colors in use site by site, and How many colors a website palette needs what to choose for your own.
Share of sites, by the number of distinct color values in their CSS
The numbers
| Distinct color values | Sites | Share |
|---|---|---|
| 0 to 9 | 25 | 2.5% |
| 10 to 24 | 59 | 5.9% |
| 25 to 49 | 120 | 12% |
| 50 to 99 | 234 | 23% |
| 100 to 199 | 330 | 33% |
| 200 to 399 | 186 | 19% |
| 400 to 799 | 36 | 3.6% |
| 800 or more | 10 | 1% |
How colors are written
Hex is everywhere: 99.6% of the sites write at least one hex code, and hex codes are
81% of all 1,181,518 color values in the study. rgb() follows on
89% of the sites, named colors such as white on 75%,
hsl() on 37%. 16% keep a color as bare numbers in a
variable for rgb() or hsl() to read, as Shopify and Wix themes do.
The notations of CSS Color 4 are still rare: oklch() is on 5.9% of the sites, lab() on
1.9%, oklab() on 2.3% and color() on
1.2%.
48% of the sites write nothing but hex codes, named colors and rgb().
Newer functions spread faster than the notations: color-mix() is on 22%,
relative colors on 5.6%, light-dark() on 1.8%.
How many websites use OKLCH has the detail, and What OKLCH is
why palette tools moved to it.
Share of sites. A site counts once for every notation it uses.
The numbers
| Notation | Sites using it | Share of sites | Share of all color values |
|---|---|---|---|
| Hex (#rrggbb) | 992 | 99.6% | 81% |
| rgb() and rgba() | 890 | 89% | 15% |
| Named colors | 745 | 75% | 1.2% |
| hsl() and hsla() | 372 | 37% | 1.3% |
| Channels in a variable | 164 | 16% | 0.7% |
| oklch() | 59 | 5.9% | 0.7% |
| oklab() | 23 | 2.3% | under 0.1% |
| lab() | 19 | 1.9% | 0.1% |
| color() | 12 | 1.2% | under 0.1% |
| hwb() | 2 | 0.2% | 0% |
| lch() | 1 | 0.1% | 0% |
Variables and frameworks
Custom properties carry much of the web's color now. 82% of the sites read at
least one color through var(), and on the median site 32% of the color
declarations do; across all sites it is 38%. The median site defines
47 variables that hold a color. That is the layer
recoloring a site with CSS variables works on.
Tailwind CSS is the framework seen most: its variables are on 20% of the sites, 37% of them on version 4. Bootstrap's are on 13%, and WordPress's color presets on 9.6%. 58% of the sites carry none of the frameworks the study looks for.
Share of sites, by the share of their color declarations that read var()
The numbers
| Declarations reading var() | Sites | Share |
|---|---|---|
| None | 182 | 18% |
| Under 20% | 243 | 24% |
| 20% to 40% | 115 | 12% |
| 40% to 60% | 109 | 11% |
| 60% to 80% | 164 | 16% |
| 80% or more | 183 | 18% |
Share of sites. A site can use more than one.
The numbers
| Framework or builder | Sites | Share |
|---|---|---|
| Tailwind CSS | 201 | 20% |
| Bootstrap | 130 | 13% |
| WordPress | 96 | 9.6% |
| Radix | 46 | 4.6% |
| Material | 21 | 2.1% |
| Elementor | 11 | 1.1% |
| Bulma | 2 | 0.2% |
| Framer | 2 | 0.2% |
| Ant Design | 1 | 0.1% |
| Wix | 1 | 0.1% |
| Chakra UI | 0 | 0% |
| Mantine | 0 | 0% |
| None of these | 576 | 58% |
Light and dark
92% of the home pages are light: the color behind the page is white or close to it. 6.6% are dark, and 1% sit between. Measured by the text instead of the canvas, 13% of the sites set most of their text on a dark ground. Chrome read every page in light mode.
A dark mode is more common in the CSS than on the page: 41% of the sites declare
dark colors somewhere, under a dark theme's class or attribute (33%), in a
prefers-color-scheme: dark media query (16%) or with light-dark()
(1.8%). 17% set a color-scheme that includes dark,
which turns the browser's own form controls and scroll bars dark as well.
- Light canvas92%
- Mid1%
- Dark canvas6.6%
The numbers
| Canvas | Sites | Share |
|---|---|---|
| Light | 924 | 92% |
| Mid | 10 | 1% |
| Dark | 66 | 6.6% |
| Dark mode in the CSS | 406 | 41% |
Text contrast
On the average site, 94% of the text reaches 4.5:1 against what it sits on, 3.2% lies between 3:1 and 4.5:1, and 3.1% is under 3:1. 60% of the sites have some text that fails WCAG AA, which asks 4.5:1 for text and 3:1 for large text; 40% pass everywhere. Half of the median site's text reads at 13.8:1 or better. The study blends transparent text over its background, as a browser paints it; read as opaque, the average site's failing share would be 5.8% rather than 6%.
Black or white text on a color shows how to pick the readable text color for a background, and the contrast matrix checks every pair of a palette.
- Under 3:13.1%
- 3:1 to 4.5:13.2%
- 4.5:1 or more94%
The numbers
| Contrast | Share of the average site's text |
|---|---|
| Under 3:1 | 3.1% |
| 3:1 to 4.5:1 | 3.2% |
| 4.5:1 or more | 94% |
| Sites with any text failing AA | 60% |
The top 100 sites
The 100 highest-ranked sites that loaded, in Majestic's order; the gaps in the ranks are the sites that did not. The main color is the family the engine ranks first, with its anchor's hex code. See its colors opens the site in Recolor, where the Site colours panel lists every color the engine found and Space repaints the page in a new palette. 62 of these 100 have a blue main color, against 49% of all 1,000 sites, and 7 have none.
| Rank | Site | Main color | Distinct colors | Text contrast (median) | Open |
|---|---|---|---|---|---|
| 1 | google.com | violet #681da8 | 28 | 9.01:1 | See its colors |
| 3 | youtube.com | red #ff0033 | 13 | no text read | See its colors |
| 6 | linkedin.com | blue #0073b1 | 138 | 10.41:1 | See its colors |
| 7 | apple.com | blue #0066cc | 58 | 8.86:1 | See its colors |
| 9 | microsoft.com | blue #0067b8 | 598 | 5.78:1 | See its colors |
| 10 | github.com | blue #0055d5 | 1,011 | 14.01:1 | See its colors |
| 11 | wikipedia.org | blue #3366cc | 103 | 5.09:1 | See its colors |
| 12 | play.google.com | blue #2962ff | 176 | 16.1:1 | See its colors |
| 14 | apps.apple.com | blue #007aff | 216 | 4.93:1 | See its colors |
| 15 | wordpress.org | blue #3858e9 | 130 | 15.43:1 | See its colors |
| 18 | en.wikipedia.org | blue #3366cc | 127 | 15.33:1 | See its colors |
| 19 | maps.google.com | blue #4285f4 | 129 | no text read | See its colors |
| 20 | wa.me | green #25d366 | 69 | 17.46:1 | See its colors |
| 23 | tiktok.com | none | 2 | no text read | See its colors |
| 24 | policies.google.com | blue #2962ff | 76 | 16.48:1 | See its colors |
| 25 | whatsapp.com | green #25d366 | 69 | 15.43:1 | See its colors |
| 26 | docs.google.com | blue #1a73e8 | 65 | 6.05:1 | See its colors |
| 27 | nginx.org | blue #55a4f1 | 29 | 21:1 | See its colors |
| 28 | f5.com | blue #0072b0 | 65 | 15.91:1 | See its colors |
| 29 | vimeo.com | cyan #17d5ff | 465 | 8.16:1 | See its colors |
| 30 | nginx.com | blue #0072b0 | 66 | 15.91:1 | See its colors |
| 35 | mozilla.org | blue #0060df | 47 | 18.1:1 | See its colors |
| 36 | t.me | blue #0088cc | 163 | 12.63:1 | See its colors |
| 39 | support.google.com | blue #0b57d0 | 72 | 16.48:1 | See its colors |
| 40 | wordpress.com | blue #3858e9 | 248 | 9.34:1 | See its colors |
| 41 | bit.ly | orange #f36600 | 143 | 11.36:1 | See its colors |
| 42 | player.vimeo.com | cyan #13b1d4 | 212 | 12.29:1 | See its colors |
| 43 | blogspot.com | red #bc382e | 24 | 3.97:1 | See its colors |
| 44 | apache.org | indigo #4643aa | 97 | 11.69:1 | See its colors |
| 45 | plus.google.com | blue #1a73e8 | 73 | 16.1:1 | See its colors |
| 46 | github.io | blue #327fc7 | 35 | 12.63:1 | See its colors |
| 47 | support.microsoft.com | blue #006dac | 214 | 5.55:1 | See its colors |
| 51 | yahoo.com | blue #0f69ff | 364 | 17.4:1 | See its colors |
| 52 | spotify.com | none | 120 | 18.73:1 | See its colors |
| 53 | qq.com | blue #3071f2 | 110 | 12.63:1 | See its colors |
| 54 | support.apple.com | blue #0066cc | 43 | 16.83:1 | See its colors |
| 55 | itunes.apple.com | blue #0066cc | 28 | 16.28:1 | See its colors |
| 56 | httpd.apache.org | blue #0073c7 | 24 | 12.61:1 | See its colors |
| 58 | gravatar.com | blue #1d4fc4 | 77 | 11.95:1 | See its colors |
| 60 | tumblr.com | blue #001935 | 183 | 14.21:1 | See its colors |
| 61 | archive.org | none | 2 | 12.22:1 | See its colors |
| 64 | creativecommons.org | indigo #2e1fb8 | 74 | 21:1 | See its colors |
| 66 | amazonaws.com | magenta #c300e0 | 286 | 12.89:1 | See its colors |
| 67 | w3.org | blue #005a9c | 31 | 18.88:1 | See its colors |
| 70 | nytimes.com | blue #346eb7 | 243 | 6.9:1 | See its colors |
| 72 | medium.com | none | 73 | 14.13:1 | See its colors |
| 73 | doi.org | blue #0d6efd | 133 | 4.5:1 | See its colors |
| 74 | soundcloud.com | blue #044dd2 | 47 | 7.14:1 | See its colors |
| 76 | forbes.com | blue #003891 | 70 | 12.32:1 | See its colors |
| 79 | web.archive.org | indigo #4b64ff | 235 | 13.97:1 | See its colors |
| 81 | zoom.us | blue #0b5cff | 191 | 19.28:1 | See its colors |
| 82 | theguardian.com | blue #0077b6 | 92 | 18.73:1 | See its colors |
| 83 | www.ncbi.nlm.nih.gov | blue #2f4a8b | 54 | 8.49:1 | See its colors |
| 84 | sourceforge.net | cyan #0099cc | 224 | 12.53:1 | See its colors |
| 85 | namecheap.com | red #d3321f | 137 | 8.86:1 | See its colors |
| 86 | paypal.com | blue #002991 | 77 | 21:1 | See its colors |
| 87 | cpanel.net | orange #cf470c | 122 | 13.97:1 | See its colors |
| 88 | googleblog.com | blue #1a73e8 | 189 | 16.1:1 | See its colors |
| 89 | who.int | blue #092862 | 407 | 14.08:1 | See its colors |
| 91 | shopify.com | cyan #02f0ff | 110 | 10.63:1 | See its colors |
| 93 | opera.com | indigo #5021ff | 155 | 21:1 | See its colors |
| 94 | dropbox.com | blue #428bff | 229 | 15.97:1 | See its colors |
| 95 | bbc.com | none | 12 | 15.96:1 | See its colors |
| 99 | launchpad.net | blue #0066cc | 173 | 21:1 | See its colors |
| 101 | tinyurl.com | cyan #9ee6f7 | 30 | no text read | See its colors |
| 103 | mit.edu | red #ff1423 | 163 | 21:1 | See its colors |
| 104 | nature.com | blue #006699 | 37 | 15.91:1 | See its colors |
| 105 | wikimedia.org | blue #3366cc | 87 | 13.64:1 | See its colors |
| 106 | bbc.co.uk | red #b80000 | 24 | 17.76:1 | See its colors |
| 107 | ibm.com | blue #0062fe | 159 | 18.1:1 | See its colors |
| 108 | workspaceupdates.googleblog.com | blue #1a73e8 | 72 | 10.47:1 | See its colors |
| 109 | discord.com | indigo #1f1d5d | 36 | 21:1 | See its colors |
| 110 | springer.com | blue #025e8d | 38 | 13.47:1 | See its colors |
| 111 | bing.com | blue #174ae4 | 130 | 5.49:1 | See its colors |
| 112 | php.net | pink #ae508d | 68 | 11.29:1 | See its colors |
| 113 | example.com | none | 2 | 18.1:1 | See its colors |
| 114 | harvard.edu | red #df072e | 103 | 15.13:1 | See its colors |
| 116 | wiley.com | green #00d875 | 9 | 21:1 | See its colors |
| 118 | gnu.org | blue #004499 | 44 | 15.91:1 | See its colors |
| 119 | pubmed.ncbi.nlm.nih.gov | blue #0071bc | 49 | 11.63:1 | See its colors |
| 121 | cdc.gov | blue #005ea2 | 170 | 6.72:1 | See its colors |
| 123 | debian.org | blue #0035c7 | 42 | 14.7:1 | See its colors |
| 125 | issuu.com | indigo #5f5de4 | 74 | 4.16:1 | See its colors |
| 126 | mp.weixin.qq.com | green #07c160 | 94 | no text read | See its colors |
| 128 | plesk.com | blue #0276d4 | 385 | 6.47:1 | See its colors |
| 129 | weebly.com | blue #3374ff | 46 | 12.73:1 | See its colors |
| 130 | expireddomains.com | green #00a327 | 154 | 6.31:1 | See its colors |
| 131 | stanford.edu | red #8c1515 | 66 | 9.4:1 | See its colors |
| 133 | openai.com | none | 783 | 21:1 | See its colors |
| 135 | dropcatch.com | blue #1a72db | 97 | no text read | See its colors |
| 138 | www.gov.uk | blue #1a65a6 | 68 | 6.08:1 | See its colors |
| 141 | g.page | blue #0b57d0 | 89 | 16.48:1 | See its colors |
| 142 | calendly.com | blue #6bb1ff | 96 | 8.66:1 | See its colors |
| 145 | stripe.com | indigo #533afd | 278 | 6.26:1 | See its colors |
| 146 | nasa.gov | red #f64137 | 109 | 19.43:1 | See its colors |
| 151 | arxiv.org | blue #1050a0 | 117 | 9.4:1 | See its colors |
| 153 | statista.com | blue #0666e5 | 283 | 6.6:1 | See its colors |
| 154 | businessinsider.com | blue #002aff | 63 | 14.91:1 | See its colors |
| 155 | commons.wikimedia.org | blue #3366cc | 120 | 5.37:1 | See its colors |
| 156 | gitlab.com | violet #7759c2 | 59 | 7.63:1 | See its colors |
What the study cannot see
- Images. Photos, logos, video and canvas keep their colors and are not read: a photo hero adds nothing.
- Scripts. With scripts off, a page that its scripts build shows only its shell, and colors a script sets are missing. A site that sends a crawler another page than a browser was measured as sent.
- One page, one width. Only the home page, at a desktop width, in light mode; hover and focus colors count at 0.2 of their weight.
- Sheets the fetcher could not get. 5.3% of the sites had at least one style sheet that did not come through, and its colors are missing.
Which sites load covers the same limits for the app.
Cite the study and get the data
Cite it as:
Recolor (recolor.page), "The colors of the web 2026", October 8, 2026, https://recolor.page/research/colors-of-the-web-2026/The data is one row per domain attempted, with every measure above, the main color and the 5 heaviest colors of each site: dataset.csv and dataset.json. It is licensed CC BY 4.0: use it for anything, crediting "Recolor (recolor.page), The colors of the web 2026". The list of sites is Majestic's, licensed CC BY 3.0 with the attribution "Majestic". Every figure on this page, with its definition and the number of sites it counts, is in results.json.
Common questions
Is blue the most common color on websites?
Yes. Blue is the main color of 49% of the 1,000 sites and appears as a family on 67%; red comes next as a main color at 16%.
Does the study count the colors in images?
No. Images, video and canvas keep their colors and are not read; only the colors in the page's CSS, style attributes and color attributes count.
Were the pages loaded with their JavaScript?
No. Scripts were off, so the study measured the HTML and CSS the server sends; colors that only scripts set are not in it.
Did the study respect robots.txt?
Yes. It read each site's robots.txt first and skipped the 60 sites whose rules keep crawlers from the home page.
Can I use the data in my own article or research?
Yes. The dataset is licensed CC BY 4.0: credit "Recolor (recolor.page), The colors of the web 2026" and link this page. The list of sites is Majestic's, CC BY 3.0.
Can I see the colors of one of these sites myself?
Yes. Load the site into Recolor: the Site colours panel lists the colors the engine found, and Space repaints the page in a new palette.
Will there be a new edition?
Yes. The plan is an edition a year, each on its own page with its own data; this one stays as it is.
Sources
- Majestic Million, Majestic majestic.com
- Understanding success criterion 1.4.3: contrast (minimum), W3C w3.org
- CSS Color Module Level 4, W3C w3.org
- CSS Color Module Level 5, W3C w3.org
- Colors, Tailwind CSS tailwindcss.com
- RFC 9309: Robots Exclusion Protocol rfc-editor.org