A neat page element that designers have added to their websites, is a page curl. In today’s Daily Tip, I’m going to show you a quick way in Photoshop to create just that!In terms of the the Photoshop work, we’re going to keep it very simple! You really only need to create a document big enough to hold the curl. You don’t need a document the size of your whole website. I’m going to start with a document of 400px by 200px, and I’m going to fill the background with the color of my website’s background.
Once the document is created, we’re going to create the curl. I’m going to be using the Pen Tool to ensure that the curl remains editable in the future, The Pen Tool is in the Tools panel on the left, or press the letter P on your keyboard. Take note of the options on your Options Bar at the top. Make sure that the Shapes Layer button is punched in so that the curl is created on it’s own layer.
We’re ready to go! The first two points will be simple clicks, however, once you click the third point, you want to drag your mouse to the left to create a curved line. The images below outline the process.
After the 3rd point and curve is created, if you were to close the path by clicking on the first point, you’ll get a looping curve, instead of a straight line. To counter this, hold down your Alt/Option key on your keyboard and click on the 3rd point that you created.
What this did, is it broke the curve for your next action. So instead of having an ugly curve at the top of our shape, we’ll have a nice straight edge. Click on the first point that you created to close the path. That will complete the shape of the page curl. It’s time for Layer Styles! We’re going to add a Gradient Overlay and a Drop Shadow. Head to Layer > Layer Styles > Gradient Overlay. The settings for both Styles are below.
Depending on your personal preference, and the size of your shape, you’ll probably need to tweak the Layer Styles, especially the Scale and Angle of the Gradient Overlay. Here’s where we’re currently at:
While this looks semi-decent as it is, we’re going to add one more element to the design. A background. Selecting the Pen Tool once again, and making sure that the “Create new shape layer” () button is punched in, create a shape like the one you see below. Don’t worry if it goes over top of the curl. We’ll be moving it to the back in a moment.
The final steps are to move that new layer behind the curl, then apply some minor Layer Styles. In your Layer’s Panel, simply drag the newly created layer behind the curl’s layer.
And finally, once that’s complete, let’s add a Gradient Overlay to this layer, to eliminate the ugly red color that we initially gave that layer. Here’s the Gradient that I applied, but you’re free to use any colors that you wish.
And here’s our final result. You can use this image as the background of your website, making sure to not repeat the image. I would urge you to play around with the Pen Tool to get the exact result that you’re looking for.