Going Pink & Getting Inspired

In honor of “Pink for October](http://pinkforoctober.org/, I’m going to spend some time talking about different things that have been done and can be done with pink.

Has been done

The first (not last) place to go for inspiration is to others – the “has beens” who’ve done it before. That’s not to say they’re washed up old designs, because they’re NOT, but tips for things to do and things not to do. First, you can browse through “Design Snack](http://www.designsnack.com/ and see some sites with some comments and voting. This helps get an idea of what other people in the industry think of a particular idea before you say, “wow, that’s cool, I wanna do that on my site” only to find out it sucks.

Right away in my browsing I found a couple of sites which used pink, but each one used it in about the same way. Pink isn’t typically seen as a masculine color, but both of these sites were able to make it manly by using black to set it off. Raffaello’s design is done with very sleek lines and zero clutter while Daddy went a little on the darker grunge side, and both came out tough.

“Design Meltdown](http://www.designmeltdown.com/ also has a fabulous “chapter on pink](http://www.designmeltdown.com/chapters/Pink/ which gives some visuals with screenshots of a bunch of pinked out sites. And if it’s all just too pink for you, there’s always the “chapter on blue and pink](http://www.designmeltdown.com/chapters/PinkandBlue/ which focuses on sites which favor more blue mixed in.

Finding the right combination of color to go with your pink is a tough task. Designers can spend a great number of billable hours on finding just the right colors before a design really gets anywhere. There are hundreds of tints and shades of any particular color, and even pink, as plain as it seems in its bubblegum stereotype, actually has the same number of combinations as any other color. The trouble is in finding something to compliment it.

You could go all pink, using different shades of the same color. A light combination of bublegum colors would make a nice feminine getaway, while some rich wine shades would give a bold and sophisticated style as seen on “LeaLea.net](http://lealea.net. And then there’s the classiness of “Think Pink](http://www.thinkpinkstudio.com/ which though it has pink in the title, uses mostly white to make pink the thematic centerpiece instead of the overbearing in-your-face, ha-ha-i’m-pink kind of thing you’d expect from something with pink in the title. You could also blend the colors together in light and dark, like “Dragon Armoury Creative](http://www.dacreate.co.uk/ did.

If pink isn’t your favorite color, you’re probably best off to find some complimentary color to mix. The web 2.0 favorite is blue with “flickr](http://flickr.com/ being the one that comes to mind first. But there are others like “Jared Christensen](http://jaredigital.com/ who’ve found a way to use “web 2.0 colors” in a totally classy way.

Step away from the computer

My favorite way to get inspiration, way beyond looking at the has beens, is to get outside the house and look at what people are doing with color out there. I know, it’s a little scary to leave the security of your best friend Mr. Keyboard and Ms. Mouse, but I’m sure they could use a break from you too. Here are a few of the places I find most of my inspiration:

Arts and crafts stores

My ultimate favorite place for color and layout inspiration comes from something as simple as strolling through a “Michaels](http://www.michaels.com/ or “Jo-Ann](http://www.joann.com/. I get pattern ideas and color combinations from the scrapbooking section and lots of texture from fabrics and ribbons. Looking and frames gives me ideas for layouts and the sculpture, baskets, flowers, etc. all feed my 3-dimensional inspiration.

The mall

Window dressers have a tough job. I know, I’ve done it. It’s tiring and totally thankless because some darn customer is going to come along and want to buy the outfit you just placed so strategically. But, if not for these window designers there would be one less place to get inspiration. Look at the clothing, the fabric, and then look at how the designer placed the clothing. The smaller stores likely don’t pay much attention, but the bigger stores spend lots of money to get their windows to look just right. Take note of what they’re doing and see how you can apply it to your 2-dimensional world on the web.

The food court (or a restaurant)

The food court is my first stop at the mall because food helps me think. There’s also some great color ideas with food. Granted, you’ll have a tough time finding decent pink food, but in general, there are good ideas found in everything from the french fries to the signage, to the tables and chairs. If you look closely at their shape, there was a designer behind that. Take notes, it makes people wonder what’s so special about a chair.

Book stores

Finally, book stores are a really solid place for inspiration because you have so many different kinds of 2-dimensional muses. You have architecture books, home and garden magazines are great too, and then you have the stationery and journal department, which is a lot like the scrapbooking section of the arts and craft stores. And, most of the big book stores now have a music section as well, so if you’re looking for more street types of inspiration, the music section can cater to that need more specifically.

Texturize

Texture is important when you’re working in a flat dimension, like we do on the web. It’s always a challenge to make things stand out, so we use shadows and gradients to give the appearance of reflecting light, but texture in patterns and other background elements can deepen your layout. I like to look at fabrics, clothing and outdoor elements like sand or concrete to get ideas for texture. Via the “Godbit forum](http://godbit.com/forum/ recently I found “Texture King](http://www.textureking.com/ which is a really cool place to find inspiration and stock images in the form of textures.

When you’re looking at textures, try to imagine them post-Photoshop, meaning, don’t take them just as they are, but try to picture them with a filter or grain applied, or picture them desaturated. Imagine the settings in photoshop you might use to change the texture into something different, not necessarily bolder – don’t go crazy with it – but something more subtle and web-friendly.

For example…

This boring but fancy little design on a piece of fabric is too dull for our purposes, but with some healing brush touches and some hue changes, it makes a nice tiled pattern to use as a backdrop to a website. You’d want to have a plain block for your content because this rosey background is pretty harsh by itself, but play with it and see what you think for yourself.

You can also take a grunge texture like this B and with the channel mixer change the way the color is distributed, making it look a little more pink – but keep the red and orange tones in there for the rusty feel.

By changing the natural display of color this way you can see what other colors come out in combination, that are just there. It takes a lot of guess work out of working with color schemes. Contrary to what I was taught in kindergarten, red goes perfectly well with pink.

Here’s a sneak peek of what I’m working on for my site for October…

I found a beautiful pink ribbon at the craft store, scanned it in, and it’s the header for the October design. I used a piece of scrap paper with letters on it for the background, which was pink, but I made it tan because shades of brown and tan are also very classy combos for pink.

Some patterns for you

I’ve made these patterns under a CC license so you can use them if you like. Some are pink, some are not, but all workable.

Be a schemer

Finally, you’ll want to head over to “Color Schemer](http://colorschemer.com or open up yours and play with all the different color combinations you can find. Take photographs of things with pink in them and use Color Schemer’s photo color picker. Personally, I like to just browse through the color gallery to see what other people have come up with. Here are “a few of my favorites](http://www.colorschemer.com/schemes/favorites.php/.

!(plain)http://static.flickr.com/74/230369350_9f3c566994.jpg?v=0! !(plain)http://static.flickr.com/90/230369344_c7839842db.jpg?v=0! !(plain)http://static.flickr.com/78/230369338_fabaee5bf3.jpg?v=0! !(plain)http://static.flickr.com/75/230369330_c3058fd631.jpg?v=0! !(plain)http://static.flickr.com/79/230369326_084c8addd0.jpg?v=0!

Go premade

If you don’t have the time or the talent to design something yourself, there’s no shame in owning that and grabbing a premade template. For Wordpress, “Beccary](http://beccary.com/goodies/wordpress-themes/ has a beautiful “pink theme](http://demo.beccary.com/index.php?wptheme=Remember, or go take a look at “all the pink themes](http://themes.wordpress.net/?cats%5B%5D=12&sortby=date&order=DESC&andor=OR&submit=Show/. Or for textpattern there’s this interesting “Desperate Housewives template](http://textplates.com/2006/01/21/desperate-housewives/.

Share Tweet me (but don't mistweet me)

Copyright © 2006 – 2010 Natalie Jost