Happy Tuesday! This week, we’re heading back to Adobe Illustrator for a fun beginner-style tutorial! We’ll create a vector coffee icon using simple shapes and add some depth with a flat design and an easy color palette. If you’ve never used Illustrator before or are just getting familiar with it, this is the perfect tutorial to get some basics down. At the end, you’ll have an infinitely rescalable vector icon you can use for web design, print work or to post to your social media accounts. Read on to see it all!
Pin it for later!
Create a Vector Coffee Icon in Adobe Illustrator
Colors used in this tutorial (RGB):
- dark blue: 49/58/84
- light blue: 209/232/238
- medium blue: 199/222/228
- white: 245/245/245
- light shadow: 230/230/230
- dark shadow: 220/220/220
- light pink: 249/176/163
- dark pink: 255/100/100
Coffee photo used as the base for this tutorial: Paper Coffee Cup via Photocritical/Bigstock
Here’s the written version of this video for how to create a vector coffee icon in Adobe Illustrator!
- Choose your base coffee photo and lock it on its own layer. Here’s the one I’m using.
- Create a new layer for your artwork. Establish the narrowest part of the cup and the widest part using rectangles. Center align them, then merge them using the pathfinder ‘unite’ icon. Remove extra, unneeded points using the delete anchor point tool to create your even taper.
- Using rectangles, create the lid of your coffee cup.
- Reduce the tapered base’s opacity slightly and create the sleeve using a rectangle that overlaps the base. Use the pathfinder to divide the two shapes and remove the extra pieces. Return the base to its original, 100% opacity.
- Add in the large shadow below the lid and the smaller, darker shadow just under the label using the pen tool. Extra tip: turn your smart guides on for easy, perfectly straight lines (view > smart guides).
- Create your symbol (heart seen here). Either freehand using the pen/pencil tool or use different shape tools.
- Group all of your elements together. If desired, add a circle for a background and/or a small oval shadow just under the cup for extra depth. Group all final pieces together. Done!