Summer Layout Photoshop Tutorial
![]() |
1. With this photoshop tutorial, you will learn how to create a summer themed web layout. The 1st thing to do is to create a 700×450 sized document in Photoshop, with a light, mint green coloured background. Use the rectangular marquee tool to create a blue rectangle at the top for the header and set the background colour to white. Use difference clouds, by going to filter - render - difference clouds.

2. Choose the grass brush and set the foreground to a dark green, such as 158223, and the background to a light green, such as ADE48C.

3. Sweep the brush left and right to produced a concentrated grass affect. Then make a selection, that covers the content area, to delete the overlapping grass.

4. Duplicate the grass layer and change it’s layer blending mode to multiply.

5. Change the hue of the duplucate layer to -24, by going to image - adjustments - hue saturation. Apply a gaussian blue of 1.2, by going to filter - blur - gaussian blur.

6. Now create a yellow circle on a new layer. Expand the selection by 5, feather it by 9 and then fill a new layer below the solid circle.

7. Using the custom shape tool, create a yellow butterfly. Rasterize the shape, make a selection out of it and then create a linear gradient across the shape, using a light and dark yellow.

8. Duplicate the butterfly a few times, changing the hue and resizing some with the transform tool (edit - transform - scale).

9. Create a long rectangle just above the content area using a dark, grey/green, and reduce it’s opacity to 50%.

10. Create a darker toned rectangle over the content area. Make a rounded rectangle over it and then make a selection using it. Make the rounded rectangle invisible and use the selection to delete the area of the darker toned layer.

11. That brings us to the end of this Photoshop Tutorial! ![]()
![]() |
Posted in web-layouts
