How to make a honey comb/cells pattern in Photoshop CS5

Example 1

  

Example 2

Today I saw a website with a honey comb background, like in the image above (the one with the fade).  When I saw it I figured it was worth a try and after a bit I figured I'd share my process on how to make the pattern with you!


PLEASE NOTE: I'm working on a mac so all key commands are for mac.

Preperation
Lets start by making a new file...

We want our new document 90px wide and 50px high with a 10px/in resolution. This resolution is used because it will make our job easier later, when we are laying out our pattern.


Once out new document opens, click the zoom tool (Z key) and zoom in to make the document easier to work with. I like to stretch the window as well so I can work close to the edge of my document.


Next lets turn on our grid (View> Show> Grid or Command ' ) and snapping (View> Snap or Shift + Command + ; )


For this pattern, we are only going to use the Line Tool (U key).  
If you don't see the line tool press Shift + U until the line tool is selected.

Once you have it selected look to the top tool bar. 

We want to make sure the fill pixels option is selected, and the weight is 2px(this can be changed depending on how thick you want your honey comb lines)


Designing the pattern 

First we are going to make a line from the left edge, exact center to the top edge 15px in or one and a half lines as seen below.

Next we make the top line from our last point 30px to the right. This line will be half the weight of the rest of our lines (1px).

Now we are going to make the opposite of the line we made. From our last point go 15px right and 25px down

Then 15px left and 25px down.

30px more back to the left for the bottom edge. Just like the top line this one is also 1px wide.

Then connect our last point to our first point.

Lastly we want to make a line from our fourth point 30px to the right.

Now you make this your pattern. Select Edit > Define Pattern. 

 

 A dialogue box will appear asking you to name your new pattern.

I named my pattern "Honey Comb Cells"

Using the pattern

To use your pattern select the layer you want to use the pattern on and open the "Layer Properties" dialog box (double click the layer).

From the style list select Pattern Overlay.

In the pattern overlay select the "Honey Comb Cell" pattern we created from the pattern drop down box.

You can adjust the pattern by using the scale slider below the drop down box, or you can change the opacity of the pattern to show whats underneath, like in the gradient example at the top of this post.

That's it! Thanks for reading, I'll post more soon! Let me know what you think and if you'd like to know how to make your honey comb texture look like Example 2, comment and I'll post a quick tutorial on that.



Check out my website at CDuenasProductions.com 

Also, I have a new site I'm working on, check out UndeadDatabase.com