Get your designs in shape with this simple linear vector icon tutorial! Creating a clean, outstanding flat linear vector icon can be an easy and fun exercise in shape building. Make a whole set for your desktop or website dashboard!

Tutorial Details: Flat Linear Vector Icons

• Program: Adobe Illustrator CC
• Difficulty: Beginner
• Topics Covered: Shape Building, Live Corners, Stroke Panel
• Estimated Completion Time: 15 Minutes

Final Image: Flat Linear Vector Icons

Step 1: Flat Linear Vector Icons

Let’s start with a camera linear vector icon reminiscent of Adobe Photoshop. Draw a rectangle using the Rectangle Tool (M). With the Direct Selection tool (A), select the rectangle and pull the Live Corners inward to round out the corners of your shape.

Step 2

With the Ellipse Tool (L), draw a circle in the rectangle (slightly off to the left). Draw two smaller circles in the first to create the camera’s shutter. Align the circles to their centers in the Align panel.

Step 3

For additional details, draw a rectangle in the lower left corner of the camera. Select only the lower left anchor point with the Direct Selection Tool and pull the Live Corner inward to match the radius of the camera’s corner. Use the Line Segment Tool (\) to draw four identical lines in the newly created box.

Step 4

For the details of the camera linear vector icon, draw a narrow vertical rectangle on the inner right side of the camera. Then add two smaller rectangles on the outer left. Finally, one slightly rounded rectangle on the upper left. Make sure all strokes are set to Rounded Caps and Rounded Corners in the Strokes panel.

Step 5

Next up is a pen nib that represents Adobe Illustrator. Use the Polygon Tool to draw a tall rectangle. Using the Add Anchor Point Tool (+), add to anchor points on either side of the triangle about 2/3 of the way down. Use the Direct Selection Tool to pull each anchor point outward a bit and the lower anchor points inward.

Step 6

Once you have your basic pen tip shape, overlap it in the center of the pen tip with a rectangle. Hit Minus Front in the Pathfinder panel so you have one perfect half left of the shape.

Step 7

Copy (Control-C) and Paste (Control-V) one half of the design. Reflect it over a Vertical Axis and Align the two halves along their inner edges. Hit Unite in the Pathfinder panel to complete the shape. I did this so my pen tip would be perfectly symmetrical.

Step 8

With the Line Segment Tool, draw a line in the center of the pen tip (from top center to the middle of the shape). Draw a small circle at the end of the line. With the Pen Tool (P), draw a small trapezoid at the bottom of the shape (flat top, flat bottom, and angled sides). Your pen nib is now complete. Group (Control-G) your icon components together and let’s move on to the last linear vector icon of our small set.

Step 9

For the folder (representing Adobe InDesign), draw a rectangle and round out the two right corners of the shape. Draw a line with the Line Segment Tool on the left side of the shape.

Step 10

Draw four rectangles with the Rectangle Tool along the right edge of the folder. Align the shapes and Distribute as you see fit in the Align panel. Draw a second line segment on the left side of the folder design.

Step 11

Let’s finish this linear vector icon with a few details. Draw a rectangle in the upper half of the design. Then add a smaller rectangle with the top right corner rounded along the top edge of the folder icon. Finally, draw four line segments in the inner rectangle on the folder icon to complete it.

Conclusion: Flat Linear Vector Icons

Fantastic work! Continue creating simple linear vector icons designs for all of your design and publishing applications. Share your results in the comment section below!

Author: Mary Winkler

Mary works under the brand Acrylicana® designing apparel, jewelry, and illustrating for companies like Disney, Jakks Pacific, Envato, and more. Check out Acrylicana.com for more artwork, tutorials, and more.