Create A Wood Grain Texture

Last up for Vectip’s Texture Week is wood grain. The steps for this technique are very similar to the previous Brushed Metal Texture tutorial. It uses the same Graphic Pen effect but stretched a little more. It also uses the Warp Tool and Twirl Tool. Also like the other texture tutorials, this technique is easy and applicable in logos, icons, interfaces or pretty much anything.
Notes
This tutorial was created with Illustrator CS3.
Keyboard shortcuts are displayed in orange. ⌘ is displayed for the Command key (mac), with the Ctrl key being the Windows equivalent (not displayed).
Rectangles
Create a 5 inch by 5 inch rectangle with the Rectangle Tool (m). An easy way to draw an exact rectangle is to click on the artboard with the Rectangle Tool (m) to bring up the Rectangle dialog to enter dimensions. Fill the rectangle with a light brown and take off the stroke.

Next Copy (⌘c) the rectangle and Paste In Front (⌘f). With the copied rectangle selected, change the dimensions for the width to 2.5 inches and the height to .25 inches in the Transform Panel and fill the rectangle with a 40% black.

Texture
Select the smaller rectangle and go Effect > Sketch > Graphic Pen. When the Graphic Pen Effect dialog comes up, change the following settings.
- Stroke Length = 15
- Light/Dark Balance = 2
- Stroke Direction = Vertical

Trace and Expand
With the texture selected go Object > Expand Appearance. With the texture still selected, the Control Panel defaults to the Live Trace options. Click the arrow beside the Live Trace Button and select Tracing Options. Or you can go Object > Live Trace > Tracing Options. You don’t have to change all the options, just the ones below.
- Mode: Black and White
- Path Fitting: 1px
- Minimum Area: 1px
- Corner Angle: 1
- Ignore White: Check this box
I like to save a preset in the Tracing Options. It makes it easy to recall these setting. If you have read previous tutorials, you will see I use these setting all the time for tracing. Next, press the Expand button on your tool bar.

Transform and Color
With the texture selected, change the width to 5 inches and the height to 5 inches from the Transform Panel. Next, change the color of the texture to a darker brown than the first rectangle.

Warp Tool
Double click on the Warp Tool (shift r) in the Tools Panel to bring up the Warp Tools Options dialog. They are probably on the default settings, but if they are not, press the reset button on the right of the dialog. Once the settings are back to default, change the Intensity to 10% and click OK.
Select just the texture and click and drag with the Warp Tool (shift r). I like to go up and down and slightly back and forth. You can do as much or as little as you want.

Twirl Tool
Click and hold down on the Warp Tool (shift r) in the Tools Panel to bring up the other transform tools. Pick the second tool in the list called the Twirl Tool. With this tool you can add some knots to your wood texture if you want. Double click on the Twirl Tool in the Tools Panel to bring up the Twirl Tool Options dialog. Below are the settings I change.
- Width =.69 (50pts)
- Height =.97 (70pts)
- Twirl Rate =10°
- Simplify = 20
With the texture selected, click and hold on the texture until you are happy with the knot. The Twirl Rate is slow so it is easy to see when you need to let go.

Experiment
You can experiment quite a bit with this technique. You can change the dimensions of the Warp Tool and Twirl Tool to create different wood grains and shapes of knots.
Below are some example uses of this texture.



lex
May 9th, 2008
its amazing on how you use the illustrator tools to make this kind of effects!
the logo looks very nice!
thanks again
bbx
May 9th, 2008
Whaou! Textures with Illustrator! That’s definitely interesting.
I just discovered this site and I really love its design and its content. Great job, and thanks for sharing your experience.
hfng
May 9th, 2008
You are the illustrator GOD.
brad
May 9th, 2008
When I first saw this tut I thought, “Why would I want to do that?” But having an editable woodgrain in vector format opens a lot of possibilities. Thanks for the great work.
Also, I usually read your posts in a RSS Reader, and am always pleasantly surprised when I venture to your actual site. Beautiful layout and coherence to your identity.
Rype
May 9th, 2008
I’m glad everyone likes the post! Brad, I’m glad you ventured into the site, but also glad you use the RSS.
danni
May 9th, 2008
PRETTY COOL.
thanks for the tip! <3
Grant Friedman
May 9th, 2008
Another great tutorial!
Natalie
May 9th, 2008
I just stumbled upon your blog through Smashing Magazine, and I’m a fan already!
This is a great tip, and something I have struggled to achieve in the past. You rock!
Andrej
May 10th, 2008
Is this effect compatible with eps 8.0? I would need it for stock.
Rype
May 10th, 2008
Andrej
Yup, it is compatible. When you trace the effect, it is nothing but basic paths.
iStockdiary
May 11th, 2008
Another good texture tutorial from Rype. The wood seems to have a rougher grain. Here is another different method on creating a smooth wood texture.
http://www.istockdiary.com/illustrator/illustrator-tutorial-wood-grain/
Rype
May 12th, 2008
iStockdiary also has a great post on realistic curtains that make a great texture.
http://www.istockdiary.com/illustrator/illustrator-tutorial-realistic-curtain/
Lore
May 12th, 2008
This is so GREAT! It’s the most realistic vector wood grain effect that I’ve ever stumbled upon.