99 Resources for Web 2.0 Design
Published November 12th, 2007 in Design
[Update: This post was originally published a while ago, however, almost all of the resources mentioned are still relevant. Since this post was published we've added tons of new resources that you may also find useful (see our Popular Posts page). To get all of the new content, subscribe to our RSS feed or by email.]
BADGES
Web 2.0 Badges – A set of free badges to download and use in your own designs.
Fresh Badge – Quickly generate your own badge.
adClustr – Starburst badges.
Deziner Folio – A collection of different badges.
BittBox – Free vector badges.
Official Seal Generator – An alternative to the typical badge.
Photoshop Tutorial – A quick lesson on making your own badge.
Glossy Photoshop Tutorial – Create a glossy badge with this tutorial.
BUTTONS
My Cool Button – A nice online tool that will help you to quickly create the button that you want.
Adam Kalsey’s Button Maker – Simple tool to make your own buttons.
Button Maker from Blog Flux – Create your own custom button.
Brilliant Button Maker – A similar button maker to the previous 2.
CSS Buttons – Choose the text, border, and background.
Buttonator – A paid option for creating buttons.
RSS Button Maker – The name pretty much says it all.
Button Boost – A little bit different than some of the other button generators.
ButtonGenerator.com – Create buttons for navigation menus.
Crystal Button – Slick web buttons made easy.
Chicklet Creator – Create buttons that allow visitors to subscribe in their feed reader of choice.
ROUNDED CORNERS
Rounded corners are a staple in web 2.0 design. Here are some tools and scripts that will help you to quickly create your own rounded corners.
LOGOS
Each of these tools will create a simple web 2.0 style logo.
ICONS
A web 2.0 site can’t ignore icons. Here are some free collections of icons to use in your own projects.
UtomBox – A great collection of web 2.0 icons.
Feed Icons – The standard RSS icon.
Map Icon Factory – Create your own map icon.
Perishable Press – A nice collection of RSS icons.
Snap2Objects – Vector RSS icons.
31 Sources of Quality, Free Icons
GRADIENT IMAGES
Another common element of web 2.0 is gradient images. Here are a few tools to help you.
Online Gradient Image Maker (OGIM)
SPEECH BUBBLES
Speech bubbles are commonly used for styling comments or blockquotes.
MySpace Speech Bubble Generator
BACKGROUND IMAGES
Background Image Maker – Create background images with choices like transparency and gradients.
Stripe Generator 2.0 – If you’re looking to add a striped background to an element on your page, you can use this tool to customize the look you want.
Stripe Designer – Easily create striped images.
Tartan Maker – Create a tartan background image.
Texture Generator – Creates textured images that you can use as a background.
All Free Backgrounds – Choose the background you want.
COLORS
The Colors of Web 2.0 – Are you looking to match the color of a popular web 2.0 site?
Web 2.0 Color Pallete – Popular web 2.o colors.
Color Schemer Gallery – Having problems choosing a color scheme? Find one you like in this gallery.
COLOURlovers – More samples of color combinations.
Website Color Picker – Test color combinations quickly.
I Like Your Colors – Get the colors used by a particular site.
NAVIGATION
CSS Menu Generator – Easily create attractive CSS menus.
Listamatic – Collection of CSS menus.
List-O-Matic – Create your own CSS menus.
List-U-Like – Another tool to create your own navigation bars.
Tabs Generator – Create tabbed images for navigation.
Flash Buttons – Create navigation menus with flash buttons
CSS Play – An extensive collection of CSS menus.
Exploding Boy – Tabbed CSS navigation menus.
CSS Navigation Menu Generator – A tool to help you create your own menu.
FAVICONS
Favicon Generator – Create your own favicon from an image on your computer.
Favicon from Pics – Create a favicon from a photo.
Favicon Editor – Upload a photo, create a favicon.
Favicon.cc – Another option for favicons.
Photoshop Tutorial – Creating a favicon with Photoshop.
CHARTS
PHP/SWF Charts – Create attractive charts.
amCharts – Flash charts.
OTHER
Avatar Maker – Create and edit an avatar.
Shrink Pictures – Create an avatar from your photo.
ScaleNine – Collection of skins and themes created for Flex and Adobe AIR.
VectorMagic – Converts bitmap images to vector art.
Templatr – Create a layout.
PsycHo – Blog template generator.
Web 2.0 Generator – Creates layouts.
Typetester – Compare fonts on-screen.
BlogPoll – Create a free poll for your blog.
RSSxl – Convert an HTML page to RSS.
Meta Tag Generator – Easily create meta tags for your pages.
URL Rewrite – Create search engine-friendly URLs for dynamic pages.
.htacces generator – Quickly create an .htaccess file.
Thumbnail Generator – Create thumbnails for a large amount of images.
Reflection.js – Adds reflections to your photos.
Drop Shadow – Improve your images with a drop shadow.
CSS Sprite Generator – From Website Performance.
Vecteezy – Stupid name. Cool vectors.
Brusheezy – Photoshop brushes.
PSBrushes.net – More Photoshop brushes.
deviantART – Photoshop brushes at deviantART
293 Responses to “99 Resources for Web 2.0 Design”
Oh wow. thank you so much for this list. This is a very good post.
Great list…pretty thorough but at least u can pick and choose thx to your descriptions
Seriously Steven,
You don’t fail to impress me with your resources each time I visit your site. Where’s the social button for Digg? I wanna digg this!
Very nice collection, liked especially the chart tools. Thank you very much for this list.
Great Tips! I really liked the Web 2.0 Logo creator. I have been wondering how people can make so beautiful logos without any designing knowledge and today I got the answer to it. Thank Vandelay
Very very good post, thank you.
wow, what a lovely condensed list… that sums up everything that’s wrong with the world (wide web)
Wow this is a great collection. Thanks!
http://askaslacker.blogspot.com
Crazy list here! Thanks for the great list, it’ll be great for customizing my blog. Stumbled =).
Nice list
http://www.colr.org may be worth checking too.
Finally i found this here… Love’em!!! Thank you for publishing these files.
This resource has been more helpful to me than you will ever imagine. I don’t know what I would do if you weren’t such a fantastic, committed blogger!
On another note, almost 1,000 RSS subscribers. That’s amazing! Your counts shoot up so quickly. Of course, there’s no doubt why. Keep up the great work.
Holy crap! Now that is a list. Good Resource.
thank you, The css menus was very cool
thank you very much for this amazing websites
this will help me so much mith websites design, and the new wave of web2.0
by the way you all should upgrade to web2.0.1 (they find a bug lol)
http://aidez.info
I have to say that you are fantastic! You have saved me hours of having to scour the internet for stuff I was looking for and you introduced me to things I didn’t know I need and now because of you these are ‘must haves’ and ‘can’t live without.’ Thank you, Thank you.
Very usefull resource: u r in my bookmarks, thank you
Great collection! I think I might use those speech bubbles for my own blog’s comments…
I recently saw Elliot Jay Stocks give a presentation at the Future of Web Design conference called “Destroying the Web 2.0 Look.” It was right on. Here are his slides: http://elliotjaystocks.com/blog/archive/2007/destroy-the-web-20-look-future-of-web-design-new-york/
Wow! Great collection. Thanks!
çok yararl? bir çal??ma olmu? tebrikler ( Turkey )
Thanks a lot.
Really good site. Thanks for the resources. Stumbled.
This is a great list! I love the badges links.
wow very nice list …veryuseful..thanks for post!
web 2.0 nice blog thank you very much
Free PHP4/5 code generation usable in Web 2.0 application
Awesome collection, Thanks for sharing it.
very good , thank you .
Thanks for sharing it.
Awesome, thankyou for sharing this
For inspiration you can check out our web 2.0 directory: http://www.feedmyapp.com/
Do the java scripts that round corners increase the loading times of the pages they are implemented on?
Leuke website, met een paar handige tips. Echter werken sommige links niet goed meer.
great poet, thanks for the tips and tricks
great post (sorry for the typo)
Thanks for sharing it.
Dude, this is awesome. All you need now is a list of sites with free web 2.0 templates
~ Wogan
thanksssss
The best list of web 2.0 resources i have EVER seen! Thanks!
thanks for post, i like it
This is a truly excellent list of web 2.0 resources. Thank you very much. Here’s another you can add to your list – 3,700 hearts graphics images and many of them are web 2.0 style.
Woops! I forgot the link to the hearts graphics images site – here it is: http://www.heartsandhearts.com.
Nice collection of web 2.0 links
Thanks for that !
Hi, you have given several very nice example for developing a website. Thanks
web 2.0 için gerekli tüm malzemeler
webmaster sources
great ressources, it’s helps me a lot when i made a “money back logo” !
Easy to use web 2.0 archive.
Great Compilation
thanks.
thanks.
Thanks for the heads up on these great resources I have found them really helpful.
Thanks for such nice collection of resources.
thanks a lot this sources
Great list!
thanks good
thank you from on now
Great posting
thanks
http://iliyas.modelschool.co.in
well, this things is very grateful, well as we know that web 2.0 is already know very popular all over the net.
cebu philippines
Thank you very very much
thank you for share.
Great post. helped me too much on my new project. all of web 2.0 resources in a simple post. Thanks.
Hi,
I just wanted to say that after looking through too many sites I’m happy to say that at last I found a site with relevant articles, that are well written and actually give me some useful information!
Thanks a lot
thank you for share.
thanks for the post great tools in this article.
Probably one of the best list of web 2.0 helping sites that I have ever see. Definitely bookmarked. Thanks a ton!
Dünya’nin bir numarali casting ajanslarindan biri olan camia artik türkiye’de. Detayli bilgi için http://www.camia.tv
Manken Casting Oyuncu Organizasyon Yapım Prodüksiyon hepsi bir arada
thanks nice post
thanks
Güzel linkler ellerine sağlık
Wow, fantastic resource! Nice work
Good design! Very interesing resourse. I fond many useful things.
Thank you!
wow there are some many things in that I had no Idea about … great web 2 0 Thank you Kelly
http://www.teachingutomakemoney.com
Great job! thanks
Its great web2.0 links resource. Thx for this collection. Maybe you should add new links?
regards,
Agencja Modelek
Many people asks wheather their sites need Web2.0…and i think YES!!!!
Great collection on web2.0 resources.
Thanks!!!!
Great list again, thanks you! Espessially I’d like “background images” block.
Thank you..
Wicked list. Lots of really cool material. 3 more suggestions:
http://www.soarport.com – allows you to publish large dimension images for free, then host them in your pages a la google maps
http://www.gliffy.com – web based visio replacement – super slick
http://www.synthasite.com – ultra online web editor. Makes web site creation super easy.
Se non hai ancora compreso il concetto di Web 2.0, con questa risorsa potrai apprezzare le parti ed i pezzi di tali design. Su questo argomento, puoi leggere anche molte informazioni utili al seguente link: 99 Resources for Good Web 2.0 Design
manken, manken resimleri, mankenler, en güzel manken resimleri
Excellent resource, thank you.
I especially like the web 2.0 logo creator and have just used it to create a logo for one of my sites.
Thanks for taking the time to put all this code on one page. Very useful.
Thanks for the Info. It helps to have links like these to stay on top of the latest in website design.
thank you…
Its great web2.0 links resource. Thx for this collection. Maybe you should add new links?
regards,
Agencja Modelek
ankara web tasarım,web tasarım ankara,ostim web tasarım,web tasarım
I love you web 2.0
thanks.
thank you for share
Found one search engine.
Just check http://xcavator.net/
Thanks for your share!
Very useful for newbies like me
Thank good
thanks.
leaving comments for the sake of comments is not what i am doing here, i am compelled to express my real feelings which i have felt after reading such a fantastic article; impressive and unique one.
thanks. super site
great , it was useful for me
thank you, The css menus was very cool
thanks for this sources
After you use all these cool links for your web 2.0 submit it to
this site http://www.ziipa.com
A nice collection of Web 2.0 gadgetry thanks!
Can be really useful even for professionals.
thank you for share.
Very useful stuff.
thanks., very good stuff to share.
Thanks, it is really cool!
wooww,great links thanks
thanks for share
banka şube adres telefon
thanks
Thanks a lot for your information on WEB 2.0.
kurye servisi of madeni Turkey Thanks to links
Great resource! Thanks for this wonderful collection.
Superb list – well done.
Oh wow. thank you so much for this list. This is a very good post.
thank you, The css menus was very cool
thank you!
Hi
Thanks for such wonderful collection this is very good resource
very good post,thanks
wowwwww…That was Amazing
Great resource! Thanks for this wonderful collection.
Thats great !!!!
Thank you very much It is enough knowledge
thanks i love the rounded corners
the best place for web 2.0 resources
You forget about Dezignus.com
Great collection, it’s in my bookmarks.
One add: for creating favicons you may wanna add the tool from Dynamic Drive, I find that one great as well.
http://tools.dynamicdrive.com/favicon/
A nice collection of Web 2.0 gadgetry thanks!
Excellent resource!… Keep up the great work!
Ovi Dogar
AbsoluteCovers.com
Thanks for share!
Very useful for who would really like to know about Web 2.0 Design.
I think this is the best collection of Web 2.0 ! Thanks for great sharing…
Very Nice… Tools to create “Web 2.0″ components are always welcomed
could maybe include nifty corners as part of your rounded corners section?
otherwise, really useful, thanks!!
Wish I had found your site a year earlier, LOL : )
Thats 99 things I dont have to search for
WOW, what a wonderful collection of time savers. Thank you.
This is a great blog!
Thats perfect
Huge list of resources.
Thanks
wow, great list, thanks for sharing
Hi!….
I was searching on internet and I found your web design blog…..it is really interesting…keep it up….look forward to read more from you
i am a starter freelancer very helpful resources for me.
thank you!
Great list
Nice collection of web 2.0 resources.
This is awesome!! I figured I’d be searching online for a while for the ideas and inspiration I was looking for… but I think I’ll be browsing around this POST for a while!
the best place for web 2.0 resources,thank you very much for this amazing websites
this will help me so much mith websites design, and the new wave of web2.0
Simply just superb. Thanx for the whole list of useful links on Web design, Superb lists, and by the way how long did you take to create this useful post. Thanx man.
Great compilation of resources for web 2.0 design! Anyone looking to design for the new web or doing a redesign will find these resources very helpful. Thank you!
Thanks, a great resource, however I feel the web 2.0 era is at the beggining of its end
Norwich,
I don’t disagree with you, but this post is a year and a half old.
Impressive collection, I must say, specially Buttons, Charts and Logos. Nice effort putting them here. I am looking forward for more posts.
Great list of tools. Since we are re designing our site this list came in handy. Thanks Vandelay !
thx, great list
i’ve shared it to all my friends. thanks!
The long search for a full list of materials about Web 2.0! Special thanks for the links to the logos in the style of Web 2.0 and buttons.
DIY (Do it yourself) Chart is a Web-based, simple and powerful online tool to create interactive charts and graphs from static or dynamic data which may be generated using any scripting language.
Support full updates and data streaming without reloading the web page. Support 3D customization, including perspective, lighting, rotation, border skins, anti-aliasing, transparencies, isometric projections, shadows, and more. Support automatic and manual layout and alignment management. Support fully customizable legends. Support export chart in a variety of formats including BMP, JPG, PNG and EMF.
With DIY Chart you can create charts for your website, blog and social network profiles, and DIY Chart may be useful for those who need to visualize financial, scientific or other type of data.
Thanks for the great list! I have bookmarked this (:
Leuke website, met een paar handige tips. Echter werken sommige links niet goed meer.
Thank you for taking you time to publish all of these on one page. Very useful indeed.
DIY Chart Builder – Free online create and design charts and graphs
Thanks man, this is really good of you, sharing.
Great list thanks for sharing. I bookmarked these links share with my friends.
Its too helpful and keep it up!
I love this post. I bookmarked it way back when you posted it, and I was going through my bookmarks, and came across it. It is a very nice list.
Check these website these are the cool one ;
for free templates : http://www.websourceinfo.com
for free tutorials : http://www.tutorialelement.com
OMG. I cannot believe how much stuff is here. Thank you so much. I’ll be using this resource time and time again.
You certainly have added tons of new resources.
This is a sensational post.
Finding all of these resources could take hours.
And here they all are here in one post.
Thanks Again
Ahh, this is a wonderful resouce. Thanks so much for posting this. Almost everything I’ve been looking for is here.
Wow, I’m glad I stumbled across this, it’s great! Thanks for taking the time to put it together (I know it’s old now but still!)
I think I’ll have to work some speech bubbles into my blog comments..
Hey, some great Web 2.0 gadgets – thanks!
great list I have bookmarked!
thank you so much for this data. This is a very very good post.
nice – > thangs is very intresting
Amazing resource thanks a load for sharing this web 2.0 resorces page! bookmarked.
Wow, I’m glad I stumbled across this, it’s great! Thanks for taking the time to put it together (I know it’s old now but still!)
I think I’ll have to work some speech bubbles into my blog comments..
thank you so much for this data. This is a very very good post.
thank you, The css menus was very cool
great web 2.0 gadget thanks
wonderful resource thanks and a nice blog
Thank you! It’s nice that you share useful information!
Fantastic article! You saved me from having to do tons of research on google by placing all of this information into one article. Thanks!
I keep coming back here to use this list when working on projects! Thanks for the great bookmark!
Finally i found this here…
Just wanted to update and say I have been using this list frequently! Just came back and found that you also a have a list for rounded corners which is perfect for my new project.
That’s really cool. Thanks!
Trackbacks