Website color schemes: The palettes of 50 visually impactful websites to inspire you

The palettes of 50 visually impactful websites to inspire you

Did you know that Facebook is blue because Mark Zuckerberg is red-green color blind? “Blue is the richest color for me; I can see all of blue” says Zuckerberg. While this choice of color doesn’t seem very scientific, it still proves that a lot of thought is put into the choice of color.

As Buffer writes, over 90% of our assessment of a product is made on color alone, so it makes sense that color should be considered with care for every design decision, particularly on websites. Chances are, if we don’t like the color palette, we’re not going to stay on the site for very long.

Did you know color is linked to pyschology? Different colors evoke different feelings—for example, red is confident, yellow is fun, and blue is trustworthy. This means you can set the tone for your website by choosing colors that reflect what you want your visitors to feel.

To get you started on your own palette, we’ve gathered 50 beautiful websites with versatile color schemes you can take inspiration from. So without further ado, let’s get knee-deep in some beautiful colors.

01. Fun and professional

mark-dearman-fun-professional-website-color-palette

Mark Dearman

This clean, vibrant palette by Mark Dearman perfectly combines warm accent colors with a clean blue background to make for a crisp and professional, but very welcoming palette. Try using colors that have a high contrast against each other for that clean effect.

Like this? Then, you'd probably like to try our Yellow Teal Photo Graduation Events Website template or this Theatre Actor Portfolio Website template.

 

02. Art-history inspired

fabrique-art-history-website-color-palette

Fabrique

When in doubt, seek colour inspiration from your content. This website for the Van Gogh Museum by Fabrique uses the vibrant, textured colors that his works are recognised for. By pairing warm yellows, rich blues, and cool greens, you get a simple, flexible palette with meaning.

03. Muted tones

martin-agency-muted-neutral-website-color-palette

The Martin Agency

This striking website design by The Martin Agency uses muted gold and off-white tones contrasted against sharper blacks and whites to create a stunning contrast. Simple, minimal, and elegant, this palette is perfect for any sophisticated design you may embark upon.

04. Modern and clean

benedict-leicht-modern-clean-color-palette

Benedict Leicht

This sharp and modern example by Benedict Leicht uses different tones of orange and blue to create a playful, energetic color palette. When using bright tones, try to balance them out with some more neutral whites or light greys as this example does, to keep things fun but not overwhelming. You can see how the website colors rake their influence from the Mathemagiker logo, creating an on-brand feel across the site.

05. Neon tones and sharp contrast

play-agency-neon-contrast-website-color-palette

Play.agency

This website by Play.agency has a color palette that takes a bold, high-contrast approach by combining a strong dark background with striking neon accent colors. By contrasting black against purples, blues, and pinks, you can create a very striking effect.

Related article: The fascinating neuroscience of color and what it means for design

06. Muted and minimal

inga-gudonien-muted-minal-website-color-palette

Inga Gudonien / MIOS

This example by Inga Gudoniene / MIOS pairs softer, desaturated, more muted colors to create an elegant look. You can achieve this timeless and elegant effect by choosing imagery with a cool, desaturated tone and pairing it with a cool grey.

07. Warm and bold

lush-warm-and-bold-website-color-palette

Lush Digital

Fancy mixing warm and cooler colors to create a unique vibe? Take a leaf from Lush Digital’s book — pair vibrant reds and blues with darker indigos and purples for a dreamy, bold effect.

08. Clean and highlighted

departika-clean-highlight-website-color-palette

Departika

This color palette for Departika is clean and professional thanks to the soft blues, greys, and whites. But, this palette draws attention and highlights focal elements by throwing a vibrant feature color into the mix. Break up your lighter, gentler colors with a punchier tone for a nice contrast.

09. Warm tones

studio-recode-warm-tone-website-color-palette

Studio Recode

This example by Studio Recode also keeps things clean and minimal, but does it with a warmer touch. By using warm, very light brown tones as the neutral background color and offsetting them with the warm tones in the imagery and type, this palette keeps things inviting and clean.

10. Sharp and modern

frost-festival-website-color-palette

Frost Festival

A great way to brand your website is to give it one dominant focal color, as this example for Frost Festival does. By using a striking turquoise as the focal color and complementing it with splashes of pale orange, greys, and mint colors, this palette keeps things fresh, modern, and simple.

Related article: How to choose the right colors for your brand

11. Cool vs. warm

akaru-cool-vs-warm-website-color-palette

Akaru

By combining warm hues with cooler ones, you can easily unlock a very punchy palette. This example by Akaru contrasts warm oranges and yellows against cool metallic greys and gunmetal tones to make for a bold, dynamic effect.

12. Pretty pastels

bc-designers-pastel-website-color-palette

B/C Designers

Pastel colors aren’t just for nursery room walls: This website by B/C Designers uses clean, bright pastel pinks, blues, and oranges to create a fun, bright, and inviting palette. When using pastels, try to mix in a fair amount of whitespace to keep things fresh and light.

Looking for something with pretty pastels? Why not this Invitation Banner or this Bridal Shower Ideas Blog Banner?

13. Bold and punchy

bold-warm-website-color-palette

Magoz

If pastel colors aren’t quite up your alley, consider looking into bright, punchy, vintage colors as this example by Magoz does. While this example uses a lot of colors all at once, it’s kept cohesive and logical with the warm consistency of the scheme.

14. Tints and tones

tints-and-tones-website-color-palette

Romain Bouchereau and Vincent Fréman

A great way to add dimension to your palette while keeping things minimal is to use varying tints of one color. This clean, elegant web page by Romain Bouchereau and Vincent Fréman does just that by using slightly different tints of a neutral peach color that compliment the focal purple color.

This website’s header image is a carousel of images, each of different colors, check it out live and in action over here.

15. Splash of color

magnium-themes-splash-of-color-website-palette

Magnium Themes

This example by Magnium Themes injects a couple bright bursts of color into the mix to create a playful, but sleek effect. The contrast of blues, oranges, and yellows against the neutral grey background makes for a professional but vibrant effect.

This color scheme works great with this Waffle Blog Banner and this School Council Blog Banner. Why not give them a try?

 

Related article: How to choose the right colors for your brand

16. Elegant and sophisticated

julian-damy-elegant-sophisticated-website-color-palette

Julian Damy

We tend to think of black and white as being the most sophisticated colors, but check out how this example by Julian Damy manages to get that sophisticated look by simply using deep blue tones and subtle gold highlights. Another palette inspired by art history, this collection of colors is timeless and beautiful.

17. Summer inspired

stradegy-summer-website-color-palette

StrADegy Advertising

When we think of summery designs we think of reds and oranges, but check out how this site by StrADegy Advertising manages to capture the warmth of the season with just corals, blues, and tan colors. A simple, minimal, and easy to use summer-inspired color palette.

18. Professional and modern

avondale-type-co-website-palette

Avondale Type Co.

Looking for a palette that screams professional, but isn’t boring or outdated? Check out this one as used on Avondale Type Co. The mix of greys, deep navys, and striking yellow tones paired with the sharp, flat, modern layout can make for an authoritative but fresh design.

19. Bold blacks and vibrant highlights

cantina-dei-colli-ripani-website-color-palette

Cantina dei Colli Ripani

If you’re in the market for a more striking, contemporary design, try to incorporate bold splashes of black and white with some vibrant pops of color, just as this example for Cantina dei Colli Ripani does. The contrast between the highlighted colors and the blacks make for a punchy, bold, and fun effect.

20. Clean gradients and fresh blues

shibui-clean-gradient-fresh-blue-website-color-palette

SHIBUI

Ever see a website and think it just looks ‘clean’? A great way to do this, as this site by SHIBUI has done here, is to use gradients. This site’s palette is made up of fresh blue and turquoise colors that have been faded into one another in a gradient to achieve a calming, clean and fresh effect.

Related article: 50 unique and engaging about us pages to inspire you

21. Cheerful and sleek

huemor-warm-citrus-website-color-palette

Huemor

This website by Huemor has a color palette that is light, modern, cheerful, and welcoming. By using vibrant colors, plenty of whitespace, and a cool, neutral blue to balance out the warmth, this palette is a prime example of how colors can make or break a site design.

22. Luxurious and modern

zach-klein-modern-coral-website-color-palette

Zach Klein

This color palette by Zach Klein brings a world of luxury, sophistication and character to the website design. By pairing navy blues, warm tans, and a dash of bright red, this site is kept modern, minimal, and very sophisticated.

23. Unique and striking

great-works-copenhagen-unique-striking-website-color-palette

Great Works Copenhagen

This professional website by Great Works Copenhagen takes less of a neutral approach to color, and instead chooses a vibrant palette. By choosing a striking red color and mixing it with various blues and navy tones, this site balances its professional air with a unique and fun flair.

24. Unexpected color combinations

intesys-unexpected-color-combinations-wesbite-palette

Intesys S.r.l.

Purple and green aren’t two colors that are often mixed, but this site by Intesys S.r.l. proves that maybe they should be. The rich purple color contrasts strikingly against the vibrant lime and sharp whites to create a unique and memorable site design.

25. Retro inspired

lowdi-website-color-palette

Lowdi

This color palette for Lowdi channels all things vintage by using warm, rich colors. This retro-inspired color palette has a lot of character and energy with a decidedly modern flair. Consider using a very pale yellow color in place of white to help hone in this effect.

Related article: Designing the perfect e-commerce website: 45 stunning examples to inspire you

26. Antique and clean

pier-luc-antique-clean-website-color-palette

Pier-Luc

This simple and elegant palette by Pier-Luc brings a touch of charm to the website design with its elegant combo of earthy red, fresh green and clean greys. By pairing this muted palette with a softly colored image, this site design manages to evoke sophistication and an antique charm.

27. Striking and energetic

hyperakt-energetic-website-color-palette

Hyperakt

Atlassian’s interactive infographic site created by Hyperakt uses bold, high saturation colors and overlays them in a way that creates stunning effect. Note as well how these striking colors are balanced out with a nice, neutral off-white color. Always maintain that balance!

28. Fresh and lively

baesman-fresh-and-lively-website-color-palette

Baesman

This site by Baesman is yet another example of how bright, vibrant colors can be used to create a professional design. By using light, clean colors and balancing them out with white space and a minimal design, this site maintains a fun and vibrant vibe without sacrificing the sleekness of a professional website.

29. Clean and crisp

brightmedia-clean-crisp-website-color-palette

BrightMedia

This example by BrightMedia is a paragon of a clean, fresh, and flexible color palette. By pairing different shades of blue with a few shades of grey, this palette is minimal and simple without being dull or boring.

30. Colorful without clashing

yoke-complementary-kids-website-color-palette

Yoke

Sometimes using a lot of colors can make for a design that is overwhelming and that clashes. But, in the case of this site by Yoke, using a bright, full palette goes off without a hitch. By muting each color slightly and including a lot of white space in the design, you can create a vibrant, colorful, yet not overwhelming effect.

Related article: 30 websites with beautifully patterned backgrounds

31. Cool and calm

roll-studio-cool-calm-website-color-palette

Roll Studio

Once again, while the typical way to signal summer and the beach is to use reds and yellows and oranges, consider taking a leaf out of Roll Studio’s book. Show a relaxed, beachy atmosphere with some turquoises, purples, and a splash of orange to create a calm, inviting and unique color palette.

32. Modern and muted

brdr-krüger-modern-muted-website-color-palette

Relax, we are the good guys

The palette of Brdr. Krüger’s website created by Relax, we are the good guys brings character and life to the website design by simply pairing a few light, soft colors. Thanks to the fact that each color is a consistent muted tone in different shades, they manage to slot in together naturally and effectively, creating a calm yet modern palette with a lot of character.

33. Earthy and fresh

aquest-earthy-and-fresh-website-color-palette

AQuest

This palette for Apparecchiato by AQuest draws its inspiration from the earthy tones of vegetables and mixes this with white space to create a stunning clean and fresh palette. Simply use leafy greens, deep reds, and rich purples alongside some whitespace to replicate this effect.

34. High saturation and high energy

el-burro-website-color-palette

El Burro

This palette for El Burro just screams fun, energy and excitement. By using higly saturated colors like hot pink, lime, cyan and yellow, you can replicate this effect and create a design that is punchy and youthful.

35. Warm and wonderful

fieldwork-website-color-palette

Fieldwork

Looking for a palette that can accommodate slightly more complex designs? Check out this one for Fieldwork that only uses five colors but manages to keep it intricate and colorful. By mixing a striking cyan with warm yellows, reds, and some deeper navies you can get a playful, engaging and flexible palette.

Related article: 10 common myths about graphic design

36. Vintage charm

cafe-frida-website-color-palette

Cafe Frida

Want to create a vintage effect without seeming dated or old? Check out this palette for Cafe Frida that uses warm golds, greens, browns and off whites to create a charming effect with a lot of class.

Like what you see? Why not try creating a Facebook Cover design of your own using this Nordic Tree Background Fall or this Couple Camping Twitter template?

 

37. Cool jewel tones

growcreate-jewel-tone-website-color-palette

GrowCreate

This example for Business Benchmark on Farm Animal Welfare by GrowCreate uses beautiful purple and blue jewel tones with subtle gradients to create a very simple but very elegant and eye-catching color palette. Plus, with the occasional pop of hot pink, this palette keeps the site design engaging, fresh and beautiful.

38. Stormy hues

cinco-stormy-website-color-palette

Cinco Design

Looking for a darker, sleeker look, but not a fan of straight-up black? Check out this stormy, moody site design by Cinco Design that uses deep purples, blues, and pinks to make for a sleek, sophisticated effect.

39. Clean and collegiate

detailsch-clean-website-color-palette

details.ch

Want a professional, tailored palette with a little color? Check out this slick palette by details.ch that uses sharp, clean, preppy colors to create a simple color palette. Don’t be afraid to throw a dash of pink amongst your blues to add a bit of a unique touch.

40. Simple and fresh

madebyshape-simple-fresh-website-color-palette

MadeByShape

This palette by MadeByShape uses an unconventional mix of colors but throws them together in a very natural way. The charcoal grey, salmon, deep teal, light mint and neutral beige colors make for a unique but beautiful combination.

41. Tropical tones

thomas-schrijer-top-10-website-color-palette

Thomas Schrijer

This beautiful site design for Thomas Schrijer’s Top 10 of 2014 uses vibrant tropical tones to create a beautiful effect. The use of warm yellows, reds, greens, and blues makes for a fun, easy, and beautiful palette suited to any energetic application.

42. Bold feature colors

joy-intermedia-bold-feature-website-color-palette

Joy Intermedia

A great way to keep your color palette from getting boring is to throw in a bold feature color amongst the more neutral, muted tones. Check out this one by Joy Intermedia that uses a base of greys, charcoals, and dark navies, but spices it up with a splash of cerise.

43. Antique tones

leibowitz-antique-tone-website-color-palette

Leibowitz Branding & Design

The Athena Art Finance website, created by Leibowitz Branding & Design uses beautiful antique tones to create an elegant and sophisticated design with a lot of charm. By taking inspiration from art history and using deep purples, blues, greens and warm golds, you can transform any webpage into a sophisticated stunner.

44. Neon and bold

calvi-on-the-rocks-website-color-palette

Calvi on the Rocks

This example for Calvi on the Rocks shows us exactly how to make use of vibrant neon tones – by balancing them out. This palette consists of a striking green, vibrant purple and a dash of royal blue, but it balances that vibrancy out with a whole lot of neutral off-white so it’s not overwhelming.

45. Simple but bold

mambo-mambo-website-color-palette

Mambo Mambo

Want the ease of a small palette but with the vibrancy of a large one? Check out this one for Mambo Mambo that uses yellow, and a few shades of green/blue to form a super simple but super stylish palette. This palette is tropical, fun, fresh, and best of all, easy.

Related article: 20 cool logos and how to create your own

46. Corporate and sleek

corporate-sleek-website-color-palette

Ryan Borker, Jermaine Craig, Mike Parsons, and Kyle Miller

Need a bit less vibrancy and a bit more professionalism? Get inspired by the beautiful colors used on this palette by Ryan Borker, Jermaine Craig, Mike Parsons and Kyle Miller. The bold navy feature color is beautifully paired with the eggshell off-white background to create one simple, sleek website design.

The only way to know if it will work is if you try it yourself. Give this Blue and Brown Twitter Post template or this Modern Interior Design Facebook Ad template your own bit of flare.

 

47. Modern and minimal

huemor-modern-and-minimal-website-color-palette

Huemor

This palette by Huemor keeps things very simple and minimal by using a predominantly monochromatic color palette and balancing it out with a few splashes of orange to draw attention — this highlights important features and bring life to the site. When in doubt, keep it simple.

48. Fun and cheerful

marie-catribs-website-color-palette

Marie Catribs

Color adds personality to your design, so try to coincide your palette with your site’s personality as Marie Catribs have done here. By using fun, bright blues, purples, yellows, etc, the fun and quirky nature of the design is brought to life.

49. Sunny and calm

traffic-sunny-and-calm-website-color-palette

TRAFFIC

Looking to create a warm, inviting website? Experiment with warm tones as TRAFFIC has done here. By using warm yellows and golds, and balancing them out with deep navy tones, this palette is calming, peaceful and inviting.

50. Pop art

visualsoft-pop-art-website-color-palette

Visualsoft

Is your site youthful? Energetic? Fun? Show that off by using bright, vibrant splashes of color like Visualsoft. The pops of neon pink, yellow and blue amongst the sleek, minimal design bring a whole lot of life and character to this site.

Next steps

Ready to take your designs to the next level? Here are some handy Canva tools to help you on your color journey

Color Wheel 

Want to know what colors look good together? Canva's Color Wheel makes color combinations easy.

Color Palette Generator 

Want a color scheme that perfectly matches your favorite images? With Canva’s color palette generator, you can create color combinations in seconds. Simply upload a photo, and we’ll use the hues in the photo to create your palette.

Color Palette Ideas 

Looking for colors that are guaranteed to look good together? We've generated thousands of designer-approved palettes for you to use in your next design.

Your secret weapon for stunning design