How To Make An Animal In Illustator

In this tutorial, we'll create six different animal portraits from i and the same circle! Permit'southward take fun making a gear up of trendy flat elements using bones shapes, the Shape Builder Tool, the Pathfinder console, and another useful functions of Adobe Illustrator!

What You lot'll Acquire in This Adobe Illustrator Tutorial

How to move and alter points to manipulate shapes
How to use the Shape Builder Tool in Adobe Illustrator
How to combine and layer shapes
How to copy and reflect shapes

This tutorial was inspired past the many beast icons on Envato Market and Envato Elements.

If you're looking for a prepare in no time at all, head on over to Envato Elements where you tin can purchase my whole Flat Animal Icons Set.

You can too find a bully selection of free SVG icons on Reshot.

i. How to Create an Elegant Siamese Cat

Step i

Commencement forming the true cat's face from an even circle of sixty x 60 px size, made with the Ellipse Tool (L). Fill the circumvolve with a sandy beige colour.

forming the cats face from an even circle

Step ii

Select both side anchor points with the Direct Selection Tool (A) and drag them downwards, changing the shape of the face.

Pace 3

At present let's class the cat's ear. Accept the Polygon Tool and brand a three-sided shape of about 17 x fifteen px size. Get to Effect > Warp > Bulge and set the Vertical Bend value to 40%.

Object > Expand Advent of the shape to employ the effect. Select the upper anchor point with the Direct Select Tool (A) and make the corner polish by clicking the Convert corners to shine button in the upper context panel. Shorten the anchor handles of this anchor point and drag the anchor indicate up, making the ear more pointed.

Pace 4

Re-create the shape and Paste it in Forepart (Control-C > Control-F). Make the copy smaller and fill it with dark-brown color. Rotate the ear and place it on the left side of the head, Sending information technology to Back (Command-Shift-[), beneath the head shape. Use the Reflect Tool (O) by double-clicking its icon in the Tools console to flip the ear over the Vertical Axis and to create a copy, placing it on the reverse side of the head.

Step v

Allow's make the top role of the head flat. Select the caput shape, take the Eraser Tool (Shift-E) and describe a narrow stripe beyond the head by holding down the Alt central. Now we've sliced the shape into two parts. Select the unneeded piece and delete it.

Footstep 6

Make a small pink triangle olfactory organ with the Polygon Tool. Select the nose and pull the circumvolve indicators of the Live Corners to make the shape rounded. If this office is unavailable in your version of Adobe Illustrator, employ Result > Stylize > Round Corners which does exactly the same.

Make a small pink triangle nose with the Polygon Tool

Footstep 7

Make some other ellipse and place information technology within the face up, so that it touches the lower point of the nose. Align the ellipse to the nose, using the nose equally a Cardinal Object. To do and then, select both shapes and click the nose while holding down Alt. You will meet a thick stroke around the olfactory organ, indicating the Key Object. Head to the Align console and click Horizontal Align Center.

So accept the Anchor Betoken Tool (Shift-C) and movement the anchor handles of the bottom anchor bespeak downwardly to about 45 degrees. Utilize the Guides to move the handles to the equal distance (you can add the Guide line by dragging information technology down to your Artboard from the Rulers (Control-R)).

Fill the face "mask" with the same chocolate-brown color as we accept on the ears, picking the color with the Eyedropper Tool (I). Add a smaller, lighter-brownish ellipse below the mask, depicting the lower jaw.

Step 8

Now let's add the eyes! Brand an ellipse, select its right ballast point and convert it to a precipitous corner from the Convert menu in the control console above. Fill the ellipse with a bright blue color and add together another ellipse to a higher place for the iris.

Hither we demand to delete the piece of the iris that overlaps the border of the eye. Select both ellipses, and apply the Shape Architect Tool (Shift-M) to erase the upper function of the iris by belongings down the Alt key and clicking the unwanted slice.

Rotate the eye a chip and create a mirrored copy using the Reflect Tool (O).

Step 9

Make 2 light-brown ellipses for the brows of our cat, and add two tiny white circles in the eyes for the highlights.

Create a lighter-pink ellipse, placing it above the upper function of the nose, and employ the Shape Builder Tool (Shift-M) property down Alt to delete the unneeded office, thus making the nose more detailed.

Stride 10

And allow's create a trendy flat shadow, covering one one-half of the cat'southward caput. Group (Control-M) all parts of the cat together, Copy the group and Paste information technology in Forepart (Control-C > Command-F). Keeping the copy selected, Unite its parts in thePathfinder panel, merging them into a single shape. Switch the Blending Mode of the silhouette to Multiply, making it semi-transparent.

Finally, select the silhouette, take the Eraser Tool (Shift-Eastward) and, holding down Alt, drag your mouse over the left half of the cat's caput, covering it with a white rectangular choice. Release the mouse button to delete the covered piece.

And here nosotros have information technology! Our flat true cat is gear up. Let'due south move on to the next element.

2. How to Draw a Cheerful Puppy

Footstep 1

As previously, we showtime forming a portrait from a 60 x 60 px circumvolve. Motility the side anchor points down a chip, making the shape bulgy, and erase its top part with the Eraser Tool (Shift-Eastward).

Select the left anchor point with the Direct Selection Tool (A) and press Enter to open the Move options window. Set the Horizontal Position value to -v px and theVertical value to 0 px and click OK, thus moving the anchor point 5 pixels to the left.

Exercise the aforementioned for the right anchor bespeak, setting the Horizontal move value to five px and moving it v px to the right.

start forming a portrait from a 60x60 px circle

Step two

Select both side anchor points and Catechumen them to precipitous corners. Adapt the position of the ballast handles using the Anchor Point Tool (Shift-C) and move them upwards, making a smooth curve of the face line.

Select both side anchor points and Convert them to sharp corners

Stride three

Let's form the ear from a forty x 35 px triangle, using the Polygon Tool. Take the Curvature Tool (Command-`) and make the sides of the triangle more rounded and bulging. If y'all're using before versions of Adobe Illustrator, which don't comprise this tool, feel costless to employ Effect > Warp > Bulge, as we did previously.

Select the upper anchor betoken, make information technology smoother and elevate it to the left, making the shape skewed. Go to Object > Path > Offset Path and set the Kickoff value to -3 px, forming the inner role of the ear. Fill up it with a light-grey color.

Stride 4

Rotate the ear and place it at the left side of the caput. Utilize the Reverberate Tool (O) to create a mirrored re-create on the reverse side.

Footstep 5

Form a dark-greyness nose from a squashed ellipse, dragging its lower anchor point down a fleck. Make 2 overlapping light-grayness ellipses beneath the nose, grouping them and Marshal with the face horizontally, using the confront shape as the Key Object.

Form a dark-grey nose from a squashed ellipse

Stride 6

At present let's brand a funny natural language sticking out! Create a light-pink rectangle using the Rectangle Tool (M), and place it under the light-grey ellipses. Select both lower ballast points and pull the Live Corners markers up to their maximum, making the bottom of the shape rounded. Take the Line Segment Tool (\) and depict a vertical stroke, while holding downwards Shift. You tin can make the tips of the line rounded in the Stroke console.

Stride 7

Allow's motility to the eyes. Make a dark-blue ellipse and cover its lower part with another ellipse or whatsoever color. Select both shapes and apply the Shape Builder Tool (Shift-M) to delete the lower ellipse together with the lesser part of the heart, which was covered. This way nosotros're making a playful look. Add a darker iris and a tiny white highlight to the center.

Rotate the eye a scrap and create a 2nd one, placing it on the other side of the face up.

Pace 8

Create two even lite-grey circles, covering the eyes. Then add together two bigger circles, overlapping and roofing the lower office of the face, as shown in the screenshot beneath. Select the lower circles and utilise the Shape Builder Tool (Shift-Grand) to delete those parts outside the face.

Select all four new pieces and Unite them in Pathfinder, making a confront "mask". You can delete the gap in the heart of the mask by clicking its border with the Straight Selection Tool (A) and deleting it.

Footstep nine

Make 2 tiny rectangles with rounded corners for the brows, making the dog look kind and cheerful, and cease up by creating a subtle shadow on the right one-half of the face.

three. How to Make a Fancy Raccoon

Stride ane

Nosotros start shaping out the face up from a 60 x sixty px pastel-blueish circle. Squash it a chip and make the shape wider. Drag both side ballast points a few pixels downwards, and Convert them to sharp corners from the Convert menu in the upper toolbar.

Copy the ears from our cat, recolor them co-ordinate to the color of the raccoon'due south head, and place them on both sides of the head.

make the face from a 60x60 px pastel-blue circle

Step 2

Make a nose from an eighteen ten ten px nighttime-gray ellipse, dragging its top anchor point upwards a bit. Create another ellipse with a nighttime-grayness Stroke color, setting the Fill colour to None in the Colour panel. Take the Scissors Tool (C) and click the left and right ballast points, splitting the shape horizontally into two equal halves. Delete the lower half, making our raccoon grin.

Stride three

Re-create the face shape and make the re-create much smaller, filling information technology with white colour and placing information technology beneath the nose area. Add together ii tiny black eyes with white highlights, group them and align to the face horizontally in the Marshal panel, making the face a Fundamental Object.

Re-create the face shape once once more, making the copy a chip smaller, make full it with dark-blue color and identify it in the bottom function of the face, forming a mask.

Step 4

Let's carve up the mask into ii halves, creating 2 separate spots around the eyes. Take the Rectangle Tool (Thou) and draw a vertical stripe beyond the middle of the face. Select both the mask and the stripe, and use the Divide function of Pathfinder to slice all the shapes. Delete the unneeded pieces, if there are whatever. Place the halves you've created beneath the optics, and make the corners slightly rounded.

Finally, add a flat shadow to the correct function of the confront. Now we can move on!

split the mask into two halves and add a shadow

4. How to Make a Kind Panda

Step one

Make a fluffy face shape from a lx x 60 px light-beige circle, moving its side anchor points downwardly.

Make a face shape from a 60x60 px light-beige circle

Step two

Copy the olfactory organ area from our dog and ready the Stroke color of the "lips" to night-grey, so that the outline is visible. Select 2 outlined ellipses (without the nose) and Unite them in Pathfinder.

Choose the Scissors Tool (C) and click the side anchor points of the outlined shape, splitting information technology apart. Delete the upper half, forming a kind smile for our panda.

Step 3

Copy the eyes from our raccoon, and permit's form large, dark-grey spots around the eyes. Make a squashed ellipse and rotate information technology a bit to the left. Use the Reflect Tool (O) to make a copy and flip it horizontally to the other side of the face up. Fill the eyeballs with white colour, and then that they are visible above the dark spots.

Keeping the eyeballs selected, get to Object > Path > Offset Path and create tiny pupils within the eyes.

Step 4

Add circular, dark-grayness ears to the panda's head, and finish up by forming a semi-transparent shadow over the right side of its face.

Great work! Let'due south move on!

5. How to Create a Wise Bear

Step ane

First making a conduct's face from a sixty 10 60 px circle. Move both side anchor points down and drag the top ballast point upwards, making the head await like an egg.

Make the top of the head flat with the Eraser Tool (Shift-E). And brand the corners of the shape slightly rounded.

make a bears face from a 60x60 px circle

Footstep 2

Add two circle ears to the top of the head, group them and Align them horizontally, using the head as a Key Object. Use the Get-go Path function with -3 px Offset value to form the dark inner part of the ears.