I have come up with a Basic Design for my web app. I want to use the Red color as it helps induce apetite. Well while designing i have managed to get the basic layout and design directions going. But messed up with the colors and as u can see have used blacks etc :(

I tried to brain storm as to how to make the layout more appealing having red as the main color. Could some one give me a few pointers as to how to go about it.


enter image description here


4 Answers 4


Hi again seems your stuck badly in this, check red color schemes online and get some working idea, try on this for working red pallets Color lover

and please look into these sites for some guidance....

  1. Red Color Combinations
  2. Check my colors
  3. Contra-st
  4. My Red
  5. 10 colour contrast checking tools to improve the accessibility of your design

I can't tell if the McDonalds thing is a random ad, or if you're going to be offering McTandoor. :-) That's not just a bit of humor. The reds in that image would be quite useful and necessary if it's a permanent part of the page, because the image is almost entirely red: only the black eyebrow and eye outlines, parts of the "skin" (orange) and the yellow arch are not firmly in the reds. You could build your entire color scheme with the eyedropper tool from that one image.

Keep your red motive color where it is, but darken and desaturate it a little (#bf1e1e would probably be enough) so it's not such a distraction. Right now it's by far the brightest of all the color elements on the page, so the eye stops dead at the site name. Make that red a little darker, precisely left-align the B of "Bakasura", the E of "Eat" and the I of "I Would..." and you will compel the eye down, into and across your top row of images.

Where you have black and gray now, use unsaturated reds (no more than 4 different colors plus a neutral gray or two). Oranges would also work -- you could eyedropper food colors from your popular images. Keep that top image row dark, because the contrast is effective and maintains a good eye trail. The #cccccc gray in the bottom left works well, as does the gray nav text. They will prevent your red mono or red/orange analogous scheme from becoming too sickly sweet.

Read up on monochromatic and analogous color harmonies for more information, and if your McDonalds ad IS a permanent part of the page, take off your saturated and unsaturated reds and/or oranges directly from that image.

  • Thanks Alan, the McDonalds is just a place holder for Ads or Promotion area. so i will need to go with the top red and a few whites and creams.. and footer i can go with a more saturated red gradient.. what do u think ?
    – Harsha M V
    Commented Jun 6, 2011 at 6:01
  • 1
    That should work well. I wouldn't use a gradient in the footer, though. You have a nice, clean look going. The food is the subject. Let the food images speak for themselves and don't distract the user with graphic effects that really add nothing to the usability of the page. A great exercise when you're making these kinds of design decisions is to ask yourself, "Why?" If you can't give a specific answer in 25 words or less, don't do it. Commented Jun 6, 2011 at 6:17
  • imgur.com/R8Ekv thanks for the feedback.. how do u think this looks..
    – Harsha M V
    Commented Jun 6, 2011 at 7:51
  • 2
    Step back for a moment and glance at the page. Where does your eye go first? That huge red area at the bottom, right? Make that 30 pixels high, same red hue but a little darker. Put your bottom nav there. Use a very dark gray or black background for the body tag. What you're trying to do is focus attention on the subject and remove any distractions, guide the visitor's eye into your site content and keep it there. Your first mockup used different colors or shades to made three clear rows, separating content by type. That was a good idea and it was more effective when there was more contrast. Commented Jun 6, 2011 at 9:00
  • 1
    A successful restaurant I know uses black heavily in their decor. Fire engines don't usually make people think of food. Tomatoes and black olives are equally appetizing. Color, in other words, is only one element in your design. It is not the most important. How you attract and lead the viewer's attention is crucial. Contrast attracts attention. It is more pleasing than monotony. Designers, photographers, architects, composers, chefs, all rely on that. You could make you Share tab "Facebook blue," or "Twitter blue" (triadic harmony) or a dark orange (analogous), but keep it contrasty. Commented Jun 6, 2011 at 17:56

Here is a great site I use when I need to create a color scheme. This link will take you to your color (cd0001) plus it's complementary/contrasting color on the color wheel.


  • Thanks MAx.. i tried that software.. for some reason i dont want the contrasts in green and blues.. want it in areas of grays, blacks.. and reds
    – Harsha M V
    Commented Jun 6, 2011 at 15:50
  • 1
    Based on what you're wanting, I'd suggest searching for "Constructivist" Designs. Here's one from Google: bit.ly/mUItXC
    – joshmax
    Commented Jun 8, 2011 at 19:32

Adobe has their own spinoff of colourlovers: http://kuler.adobe.com

You can easily search red palletes: http://kuler.adobe.com/#themes/search?term=red%20contrast


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.