Does it ever seem like certain website color schemes just get all the attention? As with every other aspect of web design, there are color schemes that tend to trend more than others. Bright colors, stark palettes, and even some mismatching schemes are elements of color that are trending.
Here’s a look at some of the best website color schemes of 2018 (in no particular order). For each, we’re also sharing the color codes that make up the key elements of the design, so it’s easy to play around with these color schemes yourself too!
.colorscheme {width:100%;}
.colorscheme span {padding: 10px 20px; color:rgba(0,0,0,0.5); width:100px; display:block; float:left; font-size:0.8em; text-transform:uppercase; margin-bottom:20px; text-align:center; font-weight:bold;}
.colorscheme span.dark {color:rgba(255,255,255,0.8);}
1. Taproot Foundation
Taproot Foundation uses one of the best, most colorful website color schemes out there. The combination of yellow, blue and kelly green work together to explain the different facets of the group that helps nonprofits. It’s not a website color scheme that you see that often but bright color with a white background is a majorly trendy option.
2. Prevent Epidemics
Prevent Epidemics uses an equally colorful scheme but paired with a dark background and greens that carry throughout user interface elements and the overall design, it all comes together. One of the most trendy color palette options is to develop a set of colors that is more wide ranging than the typical two- or three-color palette that is more common.
3. Snipcart
Snipcart uses a light gray to set the tone as the primary background color in this palette with subtle yellow accents. The solution pairs a more trendy bright color with a subtle and neutral gradient for a color palette that encourages the user to really hone in on the content.
4. Mossio
Mossio uses the same base colors here for this website color scheme – you can see the trend with black/gray and yellow, right? – only with a more saturated background and less saturated accent color. The combination has almost the same effect as the above example with a color palette that focuses on content, making the design a little more invisible.
5. Omega Yeast
Omega Yeast doesn’t look like it has a color palette beyond black and white at first glance, but this website design does something that is a big idea in color trends. The color scheme is rooted in the main image – in this case a video – rather than a background or colorful user interface elements. This trend in color is becoming more common because designers are using full-screen images to tell a brand story.
6. Forever Agency
Forever Agency uses a lot of bold color in its website design, but the palette is rooted in a bright green. This is the new neutral. (Just take note of how many of the websites in this roundup feature a green hue.) This green is a little brighter than some others using the trend but appears in plenty of locations such as the footer, brand mark and for icons and divots throughout the design.
7. Konstantopoulos/Olymp
While we are on the topic of green color schemes, Konstantopoulos/Olymp uses a subtle background (there are green olive branches in there) and a dark green brand mark to pull together everything olives. The primary brand green is distinct as well as a palette in the imagery itself that emphasizes use of the color in varying tones.
8. IC Creative
IC Creative uses a dark color overlay – black that isn’t truly black – with a bright accent color and plenty of white to create an inviting scene. Color overlays in almost every hue are a major trend in website color and a rich black option such as the one here is a nice way to give other content plenty of room on the screen. Just note the oversized headline and bright accents and calls to action.
9. Mangrove Hotel
While bright color palettes have practically ruled website deign for a few years, there’s a shift back to more muted palettes for some projects. The fleshy tone of Mangrove Hotel is warm and compliments the content well. (This same color has also been appearing in some Twitter marketing communications.)
10. Five/Four
Five/Four takes on one of the most challenging colors to create a palette with – red. And they do it in a bold way. The palette works nicely because the other colors are used in a more muted fashion as photo overlays and nothing else competes with the bright, saturated red that’s used throughout the design.
11. Atlanta Brewing
Atlanta Brewing also uses a dominant red with plenty of other accent colors. Note that the palette is not only part of the website design, but also extends to the product packaging as well. They have a pretty wide palette with primary colors as the base and a rich black and white background.
12. JYBH
Sometimes the best color palette starts with a lack of color. JYBH uses a black everything palette with varying degrees of texture and darkness. This is something you’ve probably seen a lot of when it comes to website color.
13. Distinction
Distinction uses the same all black base for its color palette with a rainbow of accent colors. If you want a wide-ranging color palette, this is the way to use the trend effectively.
14. Lucia Lash
On the other end of the color spectrum is lack of color altogether. An only black and white website color scheme is the height of mod and minimalism.
15. Pittori di Cinema
Minimalism can be in full color as well, as evidenced by Pittori di Cinema. The bright yellow scheme with black is a common high-color minimalism option. The brighter the color palette for this style, the more on-trend it seems to be.
16. Day of the Dead
Day of the Dead uses a palette featuring jewel tones and bright color for a regal feel. This balance in the color palette creates just enough contrast so that every element is easy to see but without being too distracting in this high-color environment.
17. Proud & Torn
Proud & Torn uses the same jewel-tone concept with a slightly more muted color combination. The more subtle color palette helps create visual interest for a website that features a lot of colorless images.
18. Tareq Portfolio
This portfolio site uses a background color palette that’s practically everywhere – soft gray and white. Regardless of the other color options or accents selected, light gray is hugely popular.
19. Etiya
Etiya features another popular single color as part of its overall website color palette – orange. Bright orange tones – often used with dark backgrounds that are black, navy or purple – are a trending option.
20. Baobla
Baobla features a fun gradient in a monotone color scheme. This style of color palette is ideal for new brands or product identities or if you are looking to make a lot of impact with a bold hue.
21. Stereosuper
Stereosuper takes two colors – mint green and a peachy orange – and combines them for a seemingly mismatched color palette. With so many brighter, bolder color options trending, there are more mismatched palettes out there, and surprisingly many of them work.
22. Jean-Baptiste Kaloya Portfolio
Jean-Baptiste Kaloya turns probably the most popular color in website design into a monotone palette of its own with varying degrees of blue. Also note the soft gradients on the lighter blues.
23. Igor
Igor showcases what is probably the most popular website color palette of 2018 – black, white and yellow. This color palette, although seen in varying hues, is widely popular. This combination is probably one of the most appealing.
24. Cowboy Bike
Cowboy Bike uses a black and bright color palette that’s an immediate attention getter. While most sites use black only for text, this design actually incorporates it into the bright, monotone palette.
25. Pavithra Portfolio
This portfolio site uses a Material Design palette with bright colored background images on each different scrolling screen. While at a glance it might seem like a lot of color, it works well with each screen featuring a different hue.
26. Avoconseil
Avoconseil uses a trendy tri-color palette with a flat background and accent colors in the illustrated design. This style of palette featuring three distinct colors (many also with a fourth accent) has remained popular through the rise and evolution of flat design.
27. Gabrielle Dolan
Gabrielle Dolan’s website uses the gray-white-bright color palette trend. With a distinct lack of color for most of the design the bright color seems to jump off the screen. It creates just the right focal area and amount of contrast, which is why this is a trending color scheme option.
28. Pixel Pantry
Pixel Pantry uses a distinct color pair to show off this trend – purple and teal. The combination of these two colors to create a palette is nearly unreal. You’ll find variations of this scheme almost everywhere you turn.
29. Eleven Plants
Eleven Plants uses an all neutral color scheme that’s harmonious and easy to look at. The green matches the content well and the color combinations are simple and charming.
30. Qvartz
Qvartz uses one of the most unexpected trending colors of the year in a way that mimics many other projects. With pink text, pink color blocks and a mashup of bold and softer colors, this palette is somewhat feminine but not too much so.