30 Examples of Watercolor Effects and Brush Strokes in Web Design

Apr 25 2009 by Angela Rohner | 26 Comments

There are many creative ways to use watercolor effects and brush strokes in a web design to make it really stand out. Some of the examples below use the painted effect all over their websites, and some use subtle instances that add the perfect amount of artistic flair.

In this showcase, you’ll see 30 examples of watercolor effects and brush strokes in web design.

agamicreative.com

alifelski.com

viget.com/inspire

mattdempsey.com

boompa.ca

crushlovely.com

erguvanplatin.com

ma.tt

electricpulp.com

corvusart.com

webdesignerwall.com

spring.tnvacation.com

efinterns.com

magouya.com

pallygiraffe.com

joshtilton.com

espiratecnologias.com

daninko.ca

biola.edu/undergrad

happycog.com

form-function.ca

footballmadeinafrica.com

rockatee.com

reviveafrica.com

vsplash.com

robgoodlatte.com

designerinterviews.com

cerity.se

webstock.org.nz

billyhughes.oph.gov.au

About the Author

Angela Rohner is founder of the css and flash design gallery, TheBestDesigns.com which she started in 2001. She works as an Art Director and Front End Developer in Dallas, TX. In her spare time, Angela works on personal/freelance projects, paints portraits, and rides her bike as much as possible. You can find her on Twitter or her Personal Website.

26 Comments

cah cepu

April 25th, 2009

hohohoho great showcase…
vsplash.com : typography + watercolor = look perfect…

Kawsar Ali

April 25th, 2009

Wow! some of the best designed website I see here. Thanks for sharing

Brandon Carson

April 26th, 2009

Thank you for the shout out Angela!

By the way, this made it to the front page of digg – very cool.

Janko

April 26th, 2009

Great, just when I needed watercolor examples :)

dubli-usa1.com

April 26th, 2009

I absolutely love the watercolor look, especially the agamicreative one. It seems whenever I am designing sites, though, I never think ‘gee this would look really good in a water color motif’. I suppose it is the subject matter of my sites though. thx for the examples.

Jacob Gube

April 26th, 2009

I just want to say how thrilled I am to publish Angela’s work here on Six Revisions.

We met via email and I told her how TheBestDesigns.com is my favorite design gallery. Her work at TheBestDesigns.com has inspired me creatively ever since it was founded earlier this decade (2001, I believe). When I do web design work – I always have her site open on one tab for inspiration. To have someone with such great design taste, someone who’s inspired thousands of designers, to write a post here, is truly an honor.

Azad

April 26th, 2009

Brilliant collection. I have always loved websites with watercolor designs. Very inspriring.

Thomas

April 26th, 2009

Great Inspiration, I really love josh Tilton

Kaitrece

April 26th, 2009

This is SUCH a cool list! Inspirational is what it is!

I’m technical and not a creative bone in my body, so I really admire the gifts and talents of others. When you can inspire me to even TRY some of the things I see & love, that’s DOING SOMETHING!

I don’t attempt artistic creations very much because what i see in my head NEVER shows up on the page/medium and it ends in frustration & tears usually. :-)

If I had a pinky finger full of the talent represented here I would thank God everyday for giving me such a beautiful gift!

Kaitrece

Patternhead

April 26th, 2009

Great resource with some inspirational use of painterly effects. Been a fan of the Viget design for quite a while.

Roy Vergara

April 26th, 2009

the site http://www.cerity.se featured in this list has a clone of my background. apparently my background was taken without permission and modified.

Angela

April 26th, 2009

Thanks for the feedback everyone – Glad you like it!

@Roy – I just looked at your site and emailed Jacob to let him know. Sorry this happened to you! Since you are the originator, I asked Jacob to swap out the site with yours.

Jacob Gube

April 26th, 2009

@Roy Vergara: First impression and common logic, looking at both designs side by side – I’m siding with you. But to be fair, I’ll have to contact the site owner of cerity.se (or wait for him/her to respond here in the comments) before taking action. If he or she doesn’t respond, I’ll edit the post to feature your site instead, just as @Angela has suggested.

Thanks for bringing this up with us.

Roy Vergara

April 27th, 2009

@Angela @Jacob thanks so much to both of you for looking into this. it really wouldn’t be such a big deal to me if they weren’t receiving so much attention & credit for their site. but anyways keep up the great work & i’m looking forward to more quality articles! :)

ebook cover designer

April 28th, 2009

@Angela thanks for taking the time to put this up. These are great designs and looks like hard work! Viewing this makes me want to do some of my own. Unfortunately Im quite overbooked with my regular work right now…

Ive just started using Digg and it makes it so easy to find useful content like yours. I noticed you got the top page as well…congrats!

gazduire

May 4th, 2009

mattdempsey one is really cool…

donohue

June 19th, 2009

wow!their are so beautiful!

Jonathan Olsen

June 30th, 2009

@Roy Vergara
I haven’t stolen your background. I have made my own background from scratch, the only thing I did was to get inspired from your colours, thats all.

I have my PSD with over 300layers to accomplish this design, so don’t try me.

Ashley Adams

August 28th, 2009

Websites with watercolor effects and brush strokes are something I love to watch. And it proves once again that some of the most striking web designs can be obtained with the simplest of means. By the way, I liked the designs of boompa.ca and joshtilton.com in particular.