Free tool · Color palettes · Runs in your browser
Spring color palette
Short answer
A spring palette from real photographs: the three Wikimedia Commons photos we used (Cherry blossom buds 1; Three pink cherry blossoms in Tuntorp; National Cherry Blossom Festival Parade in) gave these six colors, most common first: #E6E1E2 (37%), #497BCD (27%), #8D778D (17%), #402C22 (10%), #5F2214 (5%), #867253 (5%).
Nothing is uploaded. The picture is shrunk to 320 pixels wide in your browser and the colors are found there.
Key takeaways
- The spring palette from 3 photographs is #E6E1E2, #497BCD, #8D778D, #402C22, #5F2214, #867253.
- The most common color, #E6E1E2 (37% of the pixels), is 3.0 CIEDE2000 units from the CSS color gainsboro.
- The closest two colors of the palette are 12.4 apart (about 1 is a just noticeable difference); for protanopia 5.9, deuteranopia 8.5, tritanopia 6.7.
- Black text on #E6E1E2 has a contrast of 16.2:1 and white text 1.3:1; black text passes AA.
- Each photograph alone gave five colors: the lists are in the table, with the photographer and license.
- The complement of #E6E1E2 is #E1E6E5; the analogous pair is #E6E1E5 and #E6E3E1.
Measured: the spring palette
The most common is #E6E1E2, which is close to the CSS color gainsboro (#DCDCDC). All six are easy to tell apart; under deuteranopia the closest pair is 8.5 apart.
We searched Wikimedia Commons for photographs of the theme and kept photographs under Creative Commons or public domain licenses. For this theme we took the first three results. The tool's own palette code (k-means in CIELAB, no random numbers) found five colors in each photograph. The six colors in the table below come from all pixels of the three photographs.
| Color | Share | Nearest CSS name | Contrast on white | Contrast on black |
|---|---|---|---|---|
| #E6E1E2 | 36.5% | near gainsboro | 1.29:1 | 16.23:1 |
| #497BCD | 26.8% | near steelblue | 4.20:1 | 5.00:1 |
| #8D778D | 16.7% | near gray | 4.07:1 | 5.16:1 |
| #402C22 | 10.2% | near black | 13.11:1 | 1.60:1 |
| #5F2214 | 5.2% | near maroon | 12.17:1 | 1.73:1 |
| #867253 | 4.5% | near gray | 4.62:1 | 4.55:1 |
Spring appears here as near gainsboro, near steelblue, near gray, near black, near maroon, near gray. The photo palette is a starting point: colors from a photograph are rarely pure, and the table shows how each performs as text on white and black.
Measured: the photographs
| Photograph | Photographer, license | Search | Five colors |
|---|---|---|---|
| Cherry blossom buds 1 | W.carter, Public domain | spring cherry blossom | #497BCD 80%, #3B2B1A 8%, #636026 4%, #7F7371 4%, #CCC2B5 4% |
| Three pink cherry blossoms in Tuntorp | W.carter, CC BY 4.0 | spring cherry blossom | #89738A 39%, #463028 24%, #CEACAD 18%, #491109 11%, #7E412E 9% |
| National Cherry Blossom Festival Parade in | 3d U.S. Infantry Regiment (The Old Guard), Public domain | spring cherry blossom | #E5E2E4 46%, #736D62 32%, #1B171E 11%, #86293E 6%, #22547E 5% |
The photographs are credited with their Wikimedia Commons license. The extracted lists are the exact tool output.
Matches for the most common color, #E6E1E2
| Harmony | Colors | Closest pair, typical vision | Protanopia | Deuteranopia | Tritanopia |
|---|---|---|---|---|---|
| Complementary | #E6E1E2, #E1E6E5 | 5.5 | 0.9 | 0.7 | 6.6 |
| Analogous | #E6E1E5, #E6E1E2, #E6E3E1 | 1.5 | 1.4 | 1.2 | 0.5 |
| Triadic | #E6E1E2, #E2E6E1, #E1E2E6 | 3.0 | 1.8 | 1.5 | 1.3 |
| Split complementary | #E6E1E2, #E1E6E3, #E1E5E6 | 2.3 | 0.9 | 0.6 | 0.4 |
| Tetradic (rectangle) | #E6E1E2, #E6E5E1, #E1E6E5, #E1E2E6 | 2.9 | 0.9 | 0.7 | 2.0 |
| Square | #E6E1E2, #E5E6E1, #E1E6E5, #E3E1E6 | 2.2 | 0.9 | 0.7 | 1.4 |
Under protanopia, deuteranopia and tritanopia the colors are simulated with the Machado model at full severity; a closest pair below about 10 is hard to tell apart.
The colors as values
| Notation | Value |
|---|---|
| Hex | #E6E1E2 |
| RGB | rgb(230, 225, 226) |
| HSL | hsl(348.0, 9.1%, 89.2%) |
| CMYK (simple conversion) | 0%, 2%, 2%, 10% |
| CIELAB (D65) | 89.9, 1.9, 0.1 |
| Nearest CSS color name | gainsboro #DCDCDC (CIEDE2000 distance 3.0) |
| Contrast on white | 1.29:1 |
| Contrast on black | 16.23:1 |
Tints, shades and accessible text
| Step | Tint (toward white) | Contrast on white | Shade (toward black) | Contrast on white |
|---|---|---|---|---|
| 10% | #E9E4E5 | 1.26:1 | #CFCBCB | 1.61:1 |
| 20% | #EBE7E8 | 1.23:1 | #B8B4B5 | 2.05:1 |
| 30% | #EEEAEB | 1.19:1 | #A19E9E | 2.66:1 |
| 40% | #F0EDEE | 1.16:1 | #8A8788 | 3.56:1 |
| 50% | #F3F0F1 | 1.13:1 | #737171 | 4.85:1 |
| 60% | #F5F3F3 | 1.11:1 | #5C5A5A | 6.85:1 |
| 70% | #F8F6F6 | 1.08:1 | #454444 | 9.71:1 |
| 80% | #FAF9F9 | 1.05:1 | #2E2D2D | 13.73:1 |
| 90% | #FDFCFC | 1.02:1 | #171717 | 17.93:1 |
0 tints and 5 shades reach 4.5:1 against white. The WCAG success criterion 1.4.3 asks for at least 4.5:1 for normal text and 3:1 for large text; criterion 1.4.6 asks for 7:1 for the enhanced level.
Use it in CSS
:root { --spring-1: #e6e1e2; --spring-2: #497bcd; --spring-3: #8d778d; --spring-4: #402c22; --spring-5: #5f2214; --spring-6: #867253; }
The complement and analogous colors of #E6E1E2: #E1E6E5, #E6E1E5, #E6E3E1.
Free tools:Color palette generatorPalette from an imageImage to textCompress an image
Check the contrast before you use it for text
- Spring #E6E1E2 on white: 1.29:1; on black: 16.23:1.
- The darkest shade in the table, #171717, reaches 17.93:1 on white.
- Large text (at least 18 point, or 14 point bold) needs 3:1; normal text needs 4.5:1; the enhanced level needs 7:1.
- Do not use color as the only way to tell things apart: about 1 in 12 men have a color vision deficiency.
How the numbers were made
The hex value of each color comes from the photographs. Harmonies rotate the hue in HSL and keep saturation and lightness. Contrast follows the WCAG 2 definition with relative luminance. Color differences use CIEDE2000, which Wikipedia notes is designed so that a difference of 1.0 stands for a just noticeable difference. Color blindness is simulated with the matrices of Machado, Oliveira and Fernandes (2009) at severity 1.0. Palette extraction: pixels are grouped into 32 levels per channel and clustered with k-means in CIELAB; the same picture always gives the same palette. The accuracy test on pictures of known colors is on the palette generator page.
Questions people ask
What are good colors for a spring palette?
From our three photographs: #E6E1E2, #497BCD, #8D778D, #402C22, #5F2214, #867253.
Where do these colors come from?
From 3 Wikimedia Commons photographs under Creative Commons or public domain licenses; the table lists each one.
Is #E6E1E2 accessible for text?
On white it has 1.29:1 and on black 16.23:1. The WCAG AA minimum for normal text is 4.5:1, so black text on #E6E1E2 passes.
Can people with color blindness tell the spring palette apart?
For the six colors of the photo palette, the closest pair is 12.4 apart for typical vision and 8.5 for deuteranopia (CIEDE2000; below about 10 is hard).
How was the palette made?
The tool found the dominant colors of the photographs with k-means clustering in CIELAB. It runs in your browser; you can do the same with your own picture on the palette from image page.
Can I use these colors commercially?
Colors themselves are not licensed. The photographs used to find them keep their Creative Commons licenses, shown in the table.
Can I get a palette from my own photo?
Yes. Use the palette from an image tool; nothing is uploaded.
How many colors should a palette have?
Many designs use five: one dominant, one or two supporting, one accent and a neutral. The tool lets you choose 3 to 10 when you extract from a picture.
What is the difference between tints and shades?
A tint mixes the color with white and a shade mixes it with black. The table shows nine of each in steps of 10%.
Related
Sources and how we checked
- W3C: Understanding Success Criterion 1.4.3, Contrast (Minimum) (read 2026-10-10)
- W3C: Understanding Success Criterion 1.4.6, Contrast (Enhanced) (read 2026-10-10)
- Wikipedia: Color scheme (read 2026-10-10)
- Wikipedia: Color difference (CIEDE2000) (read 2026-10-10)
- Machado, Oliveira and Fernandes: A physiologically-based model for simulation of color vision deficiency (2009) (read 2026-10-10)
- Wikimedia Commons (the photographs, under the licenses shown) (read 2026-10-10)
Reviewed October 10, 2026. The palettes were found with the tool's own code from Creative Commons photographs; contrast, harmonies and color differences are computed. The files and results are in data/seo/hub/evidence/2026-10-10/palette.