Quick Tips: Create Pixel Pattern in Photoshop

Patterns are a great way to make your web background more beautiful. In this tutorial, we’ll show you how to create some pixel patterns using Photoshop with the estimation time 5 – 10 minutes.

Let’s get started!

STEP 1:

Start with prepare canvas. The canvas can be any size but not less than 10×10 pixels, because our pattern size are not less than 10×10 pixels. In this tutorial I use 100×100 pixels, it will facilitate when “Zoom in” and “Zoom Out”. After determining the size, next is click “OK” button.

STEP 2:

Enlarge the size of canvas view to the max

STEP 3:

Create image using “pencil tool”,

STEP 4:

With the format pencil tool; diameter 1px, brush color black #000000 and opacity 100%,

STEP 5:

Create a new layer, this layer will be used as a place for our shape pattern later.

STEP 6:

Create image as shown below on the layer that we have create on the STEP 5,

STEP 7:

With “Rectangular Marquee tool”, create selection like the image below

STEP 8:

Then crop the image by choosing Menu “Image” and sub mene “Crop”,

STEP 9:

Click the eye image on the “Background” layer, so that the image we have created on “Layer 1” look transparent,

STEP 10:

Then create the image to the pattern by choose Menu “edit” and sub menu “Define Pattern”,

STEP 11:

Will appear a tab like the image below, then please write the pattern name and click “OK”, that’s it your pattern finished.

You can see the pattern that you have made on the pattern gallery that available on your Photoshop.

Addition, below are the basic forms of the pattern as in the first image above.

Conclusion

I hope with this quick tutorial will be useful for you, especially for newbie that want to learn web design. Stay tune in the next tutorial, I’ll share with you how to create the graphic pattern by using recurrence objects, dont miss it! ^_^)v