Color is sometimes a struggle for designers, especially when on the hunt for those perfect hues that will convey the meaning behind the design at first glance. We’ve looked at some popular color palettes from a variety of media and even palettes from nature before, and now let’s take a look at some from around the Interwebs!
Dale Harris
Dale Harris uses a triad of red-violet, blue-green and yellow-orange (the text is a very, very light hue of yellow-orange) to create a really nice and less overused color scheme than the more common primary colors red, blue and yellow. The magenta (bright red-violet) and cyan (bright blue-green) colors that he uses are pretty popular right now, but he plays them off nicely against the dark purpleish grey background.
The colors here, especially against the dark background, create quite the dramatic effect. They are bright and could be cheery, but the mood created here is a little more mystical, particularly because of those glows around the paint drips and splats.
Use a palette similar to this one if you want a feeling of cool, collected, trendy, mysterious.
- Background: #412C31
- Magenta: #D10B82
- Cyan: #04DDE2
- Text: #F0EADA
AM Design
The color palette used by AM Design is bright and eye-catching. Red, blue and yellow make up a color triad (notice they are also the primary colors), and then green makes a direct complement to the red.
Intense, strong and with the cool colors of green and blue in the “window” (not just the photo of one on the home page, but all throughout the site) it makes me want to dive right in! It looks refreshing! Although red is usually a color that jumps off the page and stands out, the opposite is achieved here, where the red is so close it’s almost claustrophobic and the blue and green offer relief.
Use this color palette for a strong, intense, loud, aggressive, primary, or juvenile feeling.
- Blue: #286BFA
- Red: #E42101
- Green: #6D9815
- Yellow: #FFCC00
Capture the Valley
I love the breezy attitude Capture the Valley has and it’s due largely to color palette chosen by the designer. The red-orange in the tag and the turquoise (blue-green) are complementary colors in hues that work very nicely together. The yellow would make up the primary triad if the turquoise was a blue, but in this case, both the green and the yellow are not following any standard rules (a great example of how breaking the rules can work). I don’t know that the bright shade of green chosen is mixing well with the other three colors, but it definitely helps the Buy Now buttons stand out!
Use a color palette like this for projects that connote light, airey, relaxed, fun and summer.
- Turqoise: # 55C2DF
- Red-orange: #B14227
- Green: #6AC14C
- Sandy Yellow: #E1DEB5
Espuma
Espuma uses a color palette full of earthy colors like red-violet, yellow-green, yellow-orange and brown (dark yellow-orange). These colors almost create a split complementary (there needs to be a blue-green in there to make it a true split), and there is a definite direct (red-violet and yellow-green).
This color palette is very rich and reminiscent of a vineyard. The dark red-violet is set off nicely by the lighter yellow-orange, which is used in the navigation and headers.
Use this color palette for projects that need to be bold, rich, chic, stylish, artsy and natural.
- Purple: #54133E
- Taupe: #C4b68F
- Green: #0A6836
- Burndt Orange: #A2470E
Find this post useful? Why not subscribe to Creative Curio right away so you don’t miss another update! It’s free, and you can even subscribe via email.
Love these examples. Makes me want to pitch aside all my work and finally redesign my site with lots of pretty bright colors!
Randa,
I miss it and miss sharing it with everyone! Hopefully at the end of March things will start to settle down a bit.
I really like the new trend in web design with all the bright colors, too! I wish life would slow down enough so that I could get back to my blog redesign
Interesting tips and examples, thank you for sharing them!
Sometimes I’m not sure using complementary colors scheme, and tend to pick monotonous or analogycal hues… I used to have a tool to see how it works when they’re combined side by side, and save them using Color Pic software for further designing steps.
Color trends are getting more dynamic nowdays, Lauren, I can’t wait to see how you will experiment with colors for the blog redesign ;)
Lauren, I really liked the way you picked out the sites colour schemes apart - very inspirational. Great examples also.
I too look forward to seeing the continuation of your blog’s redesign process.
uhh the redesign - can’t wait for it :-)
Great post. I liked how you pointed out the ways to use those color palettes.
I have a small side business maintaining a family of Web sites for a childhood friend who has his own business.
I’m not a designer, but I’ve worked for many years in Web production as a project manager and a coder on projects ranging from SkyMall.com to GMBuyPower.com. I have worked very hard to keep my skills up-to-date, even though I haven’t had the word “Web” in my job description for five years now.
As grateful as I am for blogs and posts like this one (especially this one, as Dale Harris is using the same shade of purple that my friend uses in his product’s labeling), it’s not easy to find a lot of inspiration for practical (boring?) Web site design.
Beautiful personal and professional portfolio sites are terrific, and for creative, services, and boutique businesses that want and need a slick, cutting-edge look there’s no shortage of inspiring work online.
But for businesses that want a simple, clean, functional site and are selling a product or service where slick and sexy design isn’t appropriate, where are some good places to go for advice and real-world examples?
Functional site design doesn’t have to be ugly or sleep-inducing, and the right use of typography and color can make even the most simple layout pop. But I have a very hard time finding sites that showcase and/or discuss this sort of work.
Does anyone know of sites or indexes of sites like this? Is there a term or design movement/school of thought for what I’m looking for that I could plug into a search engine?
Thanks in advance.
Jeff,
Glad you found this post helpful, and welcome to Creative Curio!
There are tons of inspiring designs for clean, business-looking websites… you just have to know where to look!
Here are a couple to get you started:
Web Templates
Smashing Magazine < --that collection in particular, but they also do many website gallery collections that you can look through
There are also the myriads of CSS galleries out there. Check out my del.icio.us bookmarks on the subject, if you’re interested!
great post. It is really essential to consider colors when designing. And from what you have presented, I can sya that you are very good at it and the article is worth reading. I will surely come back to see more of your posts.
its nc inspirations………………..
2 Trackbacks
[…] Finding color inspiration around the web […]
[…] Finding Color Inspiration Around the Web: This short article shows how you can learn about color combinations from existing Web sites and how the color schemes contribute to the overall “feel” of a site. […]