![create banner effect illustrator blending create banner effect illustrator blending](https://i.pinimg.com/originals/11/01/0b/11010bc956ac47ee4da78b30e0803ffb.jpg)
![create banner effect illustrator blending create banner effect illustrator blending](https://i.pinimg.com/236x/49/25/8a/49258a4fa9753f72bc0eb9e21e785d89--illustrator-tutorials-adobe-illustrator.jpg)
After it's been nudged we'll select the shape below using the Selection Tool (V).
![create banner effect illustrator blending create banner effect illustrator blending](https://i.pinimg.com/736x/bb/6a/61/bb6a612a459ab9a7cfaec6aaaf30f741.jpg)
With the top most shape selected we will nudge it using the arrows on your keyboard up two pixels. Repeat this Copy and Paste process a second time so we should have three shapes sitting one on top of the other. Once again let's select the shape (if it isn't already) and duplicate it by Copying it (Command + C) then Pasting in Front (Command + F). Let's start by creating the bottom shadowed part. Once our shape is in one piece we can now start adding some depth to it.
![create banner effect illustrator blending create banner effect illustrator blending](https://www.psdvault.com/img/2017/08/Tropical-Land-by-Maria-Semelevich-feature.jpg)
We're rotating the gradient and offsetting the drop shadow now so that later on when we rotate the shape everything will be in place. We'll also add a Drop Shadow effect (Effect > Stylize > Drop Shadow) as outlined below. At this point let's also fill the shape with a nice blue color as outlined below and using the Appearance panel (Window > Appearance) we can apply an extra gradient fill angled to 45 degrees on top of the flat color then set the Blending Mode to Multiply and the Opacity to 75%. We will now need to Shift + Click the second object so both are selected simultaneously then in the Pathfinder panel (Window > Pathfinder) we will click the first option under Shape Modes which will unite the two objects in to one. Once reflected we can select the Selection Tool (V) then move the new shape to it lines up at the edge of the other as seen in the screenshot below. Once opened set the options as outlined in the screenshot below and hit OK to set the changes. Once duplicated we will right click on the object then select Transform > Reflect to open the Reflect dialog box. Once we have the shape to our liking we will need to Copy it (Command + C) then Paste in Front (Command + F). Once completed your document should look like the images below. Now let's set the unit of measurement to pixels from Illustrator > Preferences > Unit > General. Simply go to Illustrator > Preferences > Guides & Grid, enter 1 in the Gridline every box and 1 in the Subdivisions box. After those are on, you'll need a grid every 1px. Let's enable the Grid (View > Show Grid) and the Snap to Grid (View > Snap to Grid). When working for the web pixel perfection is a must and in order to create the rubber band shape it would be easier to have grid view set up and pixel snapping enabled so we'll do that now. Select RGB, Screen (72ppi) and make sure that the "Align New Objects to Pixel Grid" box is unchecked before your click OK. Enter 500 in the width box and 500 in the height box then click on the Advanced button. Open Illustrator and hit Command + N to create a new document. Let's start off by preparing our document. These are perfect for bringing attention to images on the web.
Create banner effect illustrator blending how to#
In this tutorial I'll show you how to use the Pen Tool (P) and Appearance panel to create a set of rubber band corner banner treatments using Adobe Illustrator.