While working on few web 2.0 sites i have found that we should have some ready to use web 2.0 color palette.
here i am presenting some simple way to use it.
Some Common Colors are listed here
Shiny silver [#EEEEEE]
Reddit white [#FFFFFF]
Magnolia Mag.nolia [#F9F7ED]
Interactive action yellow [#FFFF88]
Qoop Mint [#CDEB8B]
Gmail blue [#C3D9FF]
Shadows Grey [#36393D]
Bold
Mozilla Red [#FF1A00]
Rollyo Red [#CC0000]
RSS Orange [#FF7400]
Techcrunch green [#008C00]
Newsvine Green [#006E2E]
Flock Blue [#4096EE]
Flickr Pink [#FF0084]
Ruby on Rails Red [#B02B2C]
Etsy Vermillion [#D15600]
43 Things Gold [#C79810]
Writely Olive [#73880A]
Basecamp Green [#6BBA70]
Mozilla Blue [#3F4C6B]
Digg Blue [#356AA0]
Last.fm Crimson [#D01F3C]
so here i present to all of you a simple css code that you can add to your website css file and then just use the following id tags.
#Shiny_silver {color:#EEEEEE;}
#Reddit_white {color:#FFFFFF;}
#Magnolia {color:#F9F7ED;}
#interactive_yellow{color:#FFFF88;}
#Mint { color:#CDEB8B;}
#Gmail_blue { color:#C3D9FF;}
#Shadows_Grey {color:#36393D;}
#Mozilla_Red{color:#FF1A00;}
#Rollyo_Red{color:#CC0000;}
#RSS_Orange{color:#FF7400;}
#Techcrunch_green{color:#008C00;}_
#Newsvine_Green{color:#006E2E;}
#Flock_Blue{color:#4096EE;}
#Flickr_Pink{color:#FF0084;}
#Ruby_on_Rails_Red{color:#B02B2C;}
#Etsy_Vermillion{color:#D15600;}
#Things_Gold{color:#C79810;}
#Writely_Olive{color:#73880A;}
#Basecamp_Green{color:#6BBA70;}
#Mozilla_Blue{color:#3F4C6B;}
#Digg_Blue{color:#356AA0;}
#Last.fm_Crimson{color:#D01F3C;}
also many think that instead of following id based format we should have class based css files and hence another code with css corrected to be used in class based format.
Shiny_silver {color:#EEEEEE;}
Reddit_white {color:#FFFFFF;}
Magnolia {color:#F9F7ED;}
interactive_yellow{color:#FFFF88;}
Mint { color:#CDEB8B;}
Gmail_blue { color:#C3D9FF;}
Shadows_Grey {color:#36393D;}
Mozilla_Red{color:#FF1A00;}
Rollyo_Red{color:#CC0000;}
RSS_Orange{color:#FF7400;}
Techcrunch_green{color:#008C00;}_
Newsvine_Green{color:#006E2E;}
Flock_Blue{color:#4096EE;}
Flickr_Pink{color:#FF0084;}
Ruby_on_Rails_Red{color:#B02B2C;}
Etsy_Vermillion{color:#D15600;}
Things_Gold{color:#C79810;}
Writely_Olive{color:#73880A;}
Basecamp_Green{color:#6BBA70;}
Mozilla_Blue{color:#3F4C6B;}
Digg_Blue{color:#356AA0;}
Last.fm_Crimson{color:#D01F3C;}
hope this could help someone
< h3>Neutralsh3>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#eeeeee;border:1px solid #444;float:left;margin-right:16px;"> div>
Shiny silver < span style="font-size:0.6em;color:#888;">[#EEEEEE]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#FFFFFF;border:1px solid #444;float:left;margin-right:16px;"> div>
Reddit white < span style="font-size:0.6em;color:#888;">[#FFFFFF]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#F9F7ED;border:1px solid #444;float:left;margin-right:16px;"> div>
Magnolia Mag.nolia < span style="font-size:0.6em;color:#888;">[#F9F7ED]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#FFFF88;border:1px solid #444;float:left;margin-right:16px;"> div>
Interactive action yellow < span style="font-size:0.6em;color:#888;">[#FFFF88]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#CDEB8B;border:1px solid #444;float:left;margin-right:16px;"> div>
Qoop Mint < span style="font-size:0.6em;color:#888;">[#CDEB8B]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#C3D9FF;border:1px solid #444;float:left;margin-right:16px;"> div>
Gmail blue < span style="font-size:0.6em;color:#888;">[#C3D9FF]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#36393D;border:1px solid #444;float:left;margin-right:16px;"> div>
Shadows Grey < span style="font-size:0.6em;color:#888;">[#36393D]span>
div>
< h3>Boldh3>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#FF1A00;border:1px solid #444;float:left;margin-right:16px;"> div>
Mozilla Red < span style="font-size:0.6em;color:#888;">[#FF1A00]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#CC0000;border:1px solid #444;float:left;margin-right:16px;"> div>
Rollyo Red < span style="font-size:0.6em;color:#888;">[#CC0000]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#FF7400;border:1px solid #444;float:left;margin-right:16px;"> div>
RSS Orange < span style="font-size:0.6em;color:#888;">[#FF7400]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#008C00;border:1px solid #444;float:left;margin-right:16px;"> div>
Techcrunch green < span style="font-size:0.6em;color:#888;">[#008C00]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#006E2E;border:1px solid #444;float:left;margin-right:16px;"> div>
Newsvine Green < span style="font-size:0.6em;color:#888;">[#006E2E]span>
div>
< div style="float:right;width:200px;height:200px;margin-left:16px;"/>< script type="text/javascript">google_ad_client = "pub-1728235489150363"; google_ad_width = 200; google_ad_height = 200; google_ad_format = "200x200_as"; google_ad_type = "text_image"; google_ad_channel = "7340008063"; google_color_border = "FFFFFF"; google_color_bg = "FFFFFF"; google_color_link = "809c72"; google_color_text = "000000"; google_color_url = "aaaaaa";script>< script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">script>div>< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#4096EE;border:1px solid #444;float:left;margin-right:16px;"> div>
Flock Blue < span style="font-size:0.6em;color:#888;">[#4096EE]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#ff0084;border:1px solid #444;float:left;margin-right:16px;"> div>
Flickr Pink < span style="font-size:0.6em;color:#888;">[#FF0084]span>
div>
< h3>Mutedh3>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#B02B2C;border:1px solid #444;float:left;margin-right:16px;"> div>
Ruby on Rails Red < span style="font-size:0.6em;color:#888;">[#B02B2C]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#D15600;border:1px solid #444;float:left;margin-right:16px;"> div>
Etsy Vermillion < span style="font-size:0.6em;color:#888;">[#D15600]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#C79810;border:1px solid #444;float:left;margin-right:16px;"> div>
43 Things Gold < span style="font-size:0.6em;color:#888;">[#C79810]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#73880A;border:1px solid #444;float:left;margin-right:16px;"> div>
Writely Olive < span style="font-size:0.6em;color:#888;">[#73880A]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#6BBA70;border:1px solid #444;float:left;margin-right:16px;"> div>
Basecamp Green < span style="font-size:0.6em;color:#888;">[#6BBA70]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#3F4C6B;border:1px solid #444;float:left;margin-right:16px;"> div>
Mozilla Blue < span style="font-size:0.6em;color:#888;">[#3F4C6B]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#356AA0;border:1px solid #444;float:left;margin-right:16px;"> div>
Digg Blue < span style="font-size:0.6em;color:#888;">[#356AA0]span>
div>
< div style="font:1.6em Georgia;margin:8px 0px;">
< div style="width:32px;height:32px;background:#D01F3C;border:1px solid #444;float:left;margin-right:16px;"> div>
Last.fm Crimson < span style="font-size:0.6em;color:#888;">[#D01F3C]span>
div>
These color palette are courtesy this fantastic site http://modernl.com/article/web-2.0-colour-palette
Good one. Liked it.
Was looking for something like this..
Keep up the good work…
thanks buddy
Pingback: web 2.0 color Palette | Anant Shrivastava : Techno Enthusiast « Social Computing Technology
found your site on del.icio.us today and really liked it.. i bookmarked it and will be back to check it out some more later