Jul 09 2013

50 Beautiful Color Palettes for Your Next Web Project


Choosing the right color scheme is essential to your website’s success. Your layout and other design choices — including font — should be developed in concert with your color scheme, which can ensure readability, cohesiveness, and beauty in the final product. Unfortunately, making that choice or creating a color palette from scratch can be quite the challenge. That’s why for today’s post I’ve put together a collection of 50 beautiful color palettes that are ready to use for your next web project. If you like these, check out another 24 palettes I’ve recently rounded up.


Editor’s note: And in case you haven’t see it, check out our latest design happy hour episode!

Getting the Most Out of This Post

Before diving into the color palettes I’ve collected, I want to mention a few tools that can help you get the most out of this post. Colorzilla for Chrome/Firefox and ColorPick Eyedropper for Chrome are free tools that will help you capture the data (such as hex codes) that you will need to start experimenting with these palettes.

Editor’s Note: Want to make your own palettes even better? Check out our post on Using Color Theory to Create Better Color Palettes.

Remember that Photoshop will display certain colors far more vibrantly than they will look on the web when you use hex codes. For example, a greyed, soft pink looked super saturated until I chose “Save for Web” to preview it (this article has some thoughts on how to remedy that).

That’s all. Without further ado, here is our palette collection. Enjoy!

Pick Your Palette

1. Giant Goldfish


2. Cardsox


3. Fitz.


4. Campfire


5. Aladdin


6. Chrome Sports


7. Papua New Guinea


8. Barni Design


9. Instapuzzle


10. Our Little Projects


11. State of the Owner


12. SoftwareMill


13. iGaranti


14. Vintage Romantic


15. Nicholas Jackson Design


16. 1920 Leyendecker


17. WerkPress


18. Silmo Paris


19. Dark Sunset


20. The Color of Traffic


21. MandLoys


22. Sa Barca de Formentera


23. Contad


24. Magme


25. Enterprise Foundation


26. RS collab


27. Mohiuddin Parekh


28. Boy-Coy


29. DrupalCon


30. Windows of New York


31. Lorenzo Verzini


32. Raspberry Theme


33. Paw Studio


34. Visually Columbia


35. Andaz


36. Secret Key


37. FIG


38. Viximo


39. Osaki


40. Kashi


41. Bassenettes


42. Adam Hartwig


43. Alexandra Kuban Web Design


44. Gravual


45. Scott McCarthy Design


46. Made Together


47. Aesthetic Invention


48. LRXD


49. Enso


50. El Designo


Bonus Resources!

If you’re anything like me, then this post has inspired you to brush up on your color theory and the skills necessary to put it to good use on your next project, in which case I highly recommend checking out the following articles:

applying color theory to web design,

understanding the code behind your color swatches,

learning how to assemble your own palette,

and our own Betterment article on color theory.

And if there are any colors you’re dying to know more about, ColorHexa (which certainly “looks like the Wolfram Alpha of color”) can help you out.

We’ve also had an awesome commenter, Dima, make a GPL file of these palettes that works with GIMP, Inkscape, etc., which can be copied in (~/.config/inkscape/palettes/ or ~/.gimp-2.8/palettes/) and has a white separator between each palette.

Time for some discussion: Where do you find your color inspiration? From photographs, the web, or fabrics? What’s the certified, 100% best way to get that colorful spark? Tell us all about it in the comments below!

About the Author:

Julia Larson is a freelance copywriter & copyeditor. When not on a quadrilateral device, she’s on her yoga mat, a hike, or a cooking spree. Connect with her on Google+ and Twitter.

Leave a Response

59 Responses

  1. Jul 09 2013

    I’d be interested in hearing about what emotions and themes you’re trying to play on with these swatches? 14. Vintage Romantic and 45. Scott McCarthy design seem especially intriguing to me. This reminds me of the editorial essay in a collection of writing and I’d be really interested in hearing what about these speak to you.

    • Jul 09 2013
      Julia Larson

      Hey Stuart,

      Thanks for your comment!

      As far as emotion goes, I’d say that each palette contains its own feel, but each is high-contrast (either the palette already in the 5 hues or has the potential to be 5 accents with a grayscale/black-and-white).

      Generally the ones with muted tones (like 14 & 45) encourage me to leisurely peruse the site, while the more vibrant, candy-colored palettes spur me towards the given CTA. Those two you mentioned both offer calmer palettes with some “vintage” nostalgia and a faded/greyed feel, yet they still offer high-contrast potential (as Scott McCarthy shows on his site). There’s something about the muted, almost dustiness of these two palettes, too, that makes me think that either could go well as a color scheme for a house’s exterior or interior. What emotions and themes do you sense in them?

      Also, which editorial essay did the post remind you of? I’m curious to learn more about it :-) Thanks for sharing!

      P.S. You may enjoy this blog post that addresses color theory for individual hues: http://blog.bufferapp.com/the-science-of-colors-in-marketing-why-is-facebook-blue

  2. Jul 09 2013
    Jonathan Raymond

    Great post … and on behalf of the team behind #11 (State of The Owner), thanks for the compliment!

    • Jul 09 2013
      Julia Larson

      Hi Jonathan,

      Thanks so much! Glad you enjoyed the roundup :)

    • Nov 13 2013

      State of the Owner collection is closest to my house interior/exterior, which I had to hire a decorator to pick out because I’m (shamefaced) that indecisive. Very happily living with these colors.

  3. Jul 09 2013

    Sorry to be that picky guy, but the expression I think you want is “without further ado”. I do like your choice of color palates. (Just kidding – I know the word is “pallets” … oops, I mean “palettes” of course :-)

    • Jul 10 2013
      Nathan B Weller

      Thanks Brian! Fixed via mobile. Hopefully I didn’t miss any ;)

  4. Jul 14 2013

    No color palate/design conversation should ever be had without mentioning the Adobe site, Kuler. THIS is what designers should be using.

    • Jul 15 2013
      Nathan B Weller


      Kuler is an amazing tool! I’m pretty sure some of these were either made there or pulled directly from there.



  5. Jul 16 2013
    Mr Web Design

    Nice color for web design , thanks for sharing

    • Jul 18 2013
      Julia Larson

      You’re very welcome! Glad you enjoyed the color combos I rounded up. Stay tuned for more color-oriented posts (and loads of other good stuff) on the Betterment blog :D

  6. Jul 17 2013

    I love how bright and bold these colors are. I think Goldfish is my favorite.

    • Jul 22 2013
      Julia Larson

      Lena, Happy to hear you like the many hues :D Right on, Goldfish is great–blue and orange is probably my favorite complementary color pairing.

  7. Jul 18 2013
    • Jul 22 2013
      Julia Larson

      Veronica, I’m delighted to share the colors with you and all our readers! Hope you enjoy exploring the Betterment blog :D

  8. Jul 25 2013

    wow this is an Amazing collection ! :)

  9. Jul 27 2013

    This is just what I needed! My website is in dire need of updating. Numbers 14, 41 and 45 really caught my eye! Thanks ;)

    • Jul 29 2013
      Julia Larson

      Happy to hear this was helpful to you, Jasmyn! Stuart (in the first comment above) also gravitated toward 14 & 45. Best of luck with your site update :D

  10. Aug 11 2013

    Nice colours… but when I design a website I rather stick to 2-3 colors. for me LESS IS MORE

    • Aug 16 2013
      Julia Larson

      Hey Natalija, Thanks for your comment! Good point–keeping things simple is a smart tactic :D What tricolor combos are your go-to’s when you design? Glad you enjoyed the colors!

  11. Aug 27 2013
    Bob M.

    Thanks so much for putting together this fantastic selection! I wonder if it’s possible for someone to address a question that, oddly enough, I’ve had trouble finding.

    What’s the rule for applying the colors across a web property? What colors, left to right (or whatever), are applied to which elements? Does it start with site body and move inward to content wrapper, etc., ending with followed links or something?

    Some sort of best practice method would be very helpful.

    Thanks again!


    • Feb 20 2014
      Chris R

      Bob, you raise an excellent point. An overall color palette is one thing, knowing how to apply 6 colors to different typographic and navigational elements without looking like a rainbow is the challenge. You’d need to click to each of the sites using the palette and really examine how each color is applied: For headings? For hover colors? For buttons? Etc.

      I have the same challenge as you do, and I am a professionally trained designer!

  12. Sep 18 2013
    oyomtho john paul

    Choosing what colors to use on a webpage has been my worst nightmare. But with this collection I shall have no more nightmares thanks to you Julia Larson. I really appreciate your work.

  13. Sep 30 2013
    Goa Packages

    Seriously nice color combination.. .

  14. Oct 10 2013

    Wow this presented some really nice palettes! I went with #3 when I was designing my first website; my art portfolio. Admittedly I didn’t read up on much of the theory behind the colors and I’m sure I didn’t apply the colors quite correctly but I like the outcome! Thanks for bringing all these together; it was a big help. :)

  15. Oct 19 2013
    Federico Viola

    Hi Julia,
    thanks for this good post. It is a good idea to have a number of palettes to choose from. Selecting colours successfully can be a challenging task due to emotions and values that we attach to them. It should just be fun to pick colours and a certain level of research will help to choose a suitable candidate for a target audience. Well, your post will make the task more fun and definitely easier. Thanks for that!

  16. Oct 31 2013
    Razvan Bordeanu

    Hey can you give a visit to my personal website and give your opinion about the color palettes ?
    you can leave me a message just filling out the contact form
    have a wonderful day !

  17. Nov 05 2013
    Tech collections

    I was thinking of improving my blog’s appearance and found this. This is really helpful. I would like to know whether any specific palettes are good for technical and food sites(I have one blog http://oishirecipes.com too)?

  18. Nov 13 2013
    isuru prabath

    Great post … thanks for sharing

  19. Dec 02 2013

    Thank you for the colour schemes.

  20. Dec 05 2013
    Khuram Shahzad

    Very Beautiful colors for web designing. Thank for sharing a colorful post.

  21. Jan 30 2014
    Rebekah Teller

    I get color inspiration from nature and from children! Kids play with color so effortlessly. http://graphicdesigngoddess.blogspot.com/2014/01/bold-color-choices.html

  22. Feb 27 2014

    Awesome i would defenetly use LRXD

  23. Mar 02 2014

    I wish I had the balls to do something with these color schemes. These are really good.

  24. Mar 29 2014

    just beautiful!! number 35 inspired me to go find my cat and pet him, he’s such a devil. I wonder though, how can one resist making ice cream sandwiches after viewing number 47?? Impossible I say!!!

  25. Apr 03 2014

    I collected the palettes as a .gpl file, https://gist.github.com/dimaursu/9921467 it’s good to use in Inkscape, GIMP or whatever program uses this format too; just copy it in ~/.config/inkscape/palettes/ or ~/.gimp-2.8/palettes/ and you are all set. Each scheme is separated with a white square, called ‘separator’, and the first color of the scheme has the name on it.

  26. Dec 17 2014

    Love all these colors! I was curious, and tried inverting some of the palettes and came up with some really neat results! It just goes to show you how powerful and fun colors can be!

  27. Dec 22 2014
    Mario Martinez

    This is so helpful! My family and I are designing a website for our long-standing business for the first time ever, and this was definitely a great place for color inspiration.

  28. Feb 05 2015

    What are the hex colors for visually columbia number 34

  29. Feb 11 2015
    Kirsten NB

    Thanks for this great post. Not only was I finally able to find a color scheme that both my boss and I like, but the Chrome ColorPick Eyedropper is great.

  30. Mar 13 2015
    Muhammad Faraz

    You just saved my life. This is just awesome.

    Thanks a ton.

  31. Mar 24 2015

    Hey Julia. Thanks a lot. Really helping me get accustomed to better color combinations and of course, getting better designs prepared by the graphics agency. (Followed you on Twitter as well…just now).

  32. Mar 25 2015

    I have been struggling with the color scheme for my portal, but being a bootstrapped startup have limited resources.
    Can somebody check my portal and suggest some color scheme option on pro bono friendly basis as a Godly gesture.
    Lots of love and warm feelings in advance.