Illustrator Tackle Twill

I’m sure you’ve seen tackle twill on a hoodie before. It’s a widely used embroidery technique that involves sewing down nylon twill to a garment with zig zag stitching. This tutorial will show you how to simulate a tackle twill look with Illustrator’s Appearance palette. I’ve found that most people don’t understand the Appearance palette and that’s unfortunate because it’s really powerful. When we’re done you will be able to apply this style to any text or shape within Illustrator.

Step 1: Add some text to your artboard using a thick bulky font like College from DaFont.

Step 1

Step 2: Increase the tracking on your text to add some space between the letters.

Step 2

Step 3: Call up the Appearance palette and add a new fill to your text. Window > Appearance (Shift F6). Change the new fill color to orange-yellow.

Step 3

New Fill Color

Step 4: Select the stroke of your text in the Appearance palette and change the color to light blue. Set the weight of the stroke to 14 pt.

Step 4

New Stroke

Step 5: Now you’re probably saying to yourself, “This isn’t right! You can hardly see the yellow now.” To fix this, click-and-drag the new stroke below the orange-yellow fill in the Appearance palette. Problem solved!

Step 5

Step 6: Add another stroke to your text with the Appearance palette.

Step 7

Step 7: Set the color of the new stroke to a dark yellow, the weight of the stroke to 1 pt, and add a 3 pt dash.

Step 7

New Dashed Stroke

Step 8: Now we’ll offset the dashed stroke  -2 pt by applying the Offset Path effect. Effect > Path > Offset Path.

Step 8

Dashed Stroke Offset

Step 9: Add a white 1 pt stroke to your text and offset it by 2 pt by following the same steps as above.

Step 9

Step 10: To create the zig zag stitch you will add two more effects to the white stroke. First apply the Roughen effect which will add lots of equidistant points to our stroke path. Effect > Distort and Transform > Roughen. Now add the Zig Zag effect which will zig zag all of the extra points we just added. Effect > Distort and Transform > Zig Zag.

Step 10

Zig Zag Effect Settings

Almost Done!

Step 11: Almost Done! Duplicate the white zig zag stroke and change its color to medium blue.

Step 11

Medium Blue Stroke

Step 12: Adjust the offset of the new medium blue stroke to 7 pt.

Step 12

Step 13: Whoops, I forgot a step. Add one more stroke to your text to fill in the area between the yellow fill and the white zig zag stitch. Set the new stroke weight to 4 pt and the color to the same yellow as your text fill. Finally, click-and-drag the new yellow stroke below every other stroke and just above the text fill in the Appearance palette. Have a look at my final Appearance palette to see if you have everything in the right place.

Final Appearance Palette

Done… Download sample file(s).

Final Result

Extra: By using the Appearance palette and Illustrator’s effect menu for every step of this tutorial you new tackle twill effect is self contained. This means you could drop this effect into the Graphic Styles palette and apply it to any text or shape you would like. It also means that every setting you applied during this tutorial can be changed within the Appearance palette. Be sure to try different settings and come up with your own tackle twill styles.

Alternative Look