Home | Circular Container 001

Circular Container 001

For Use With Web Creation or Graphic Design

Below you will find various graphic design instructions as they relate to web design.


Step-By-Step Instructions:

1. Open a new document in Photoshop. 300x300 width/height allows a good workable canvas space.
2. Create a new layer. Name it "Circle".
3. Select the Eliptical Marquee tool. Hold down the SHIFT key and drag to make a perfect circular selection.



4. Select the Paint Bucket tool. Fill in the circular selection with white. (Hex Color: #ffffff).
5. Goto Select > Modify > Contract. Contract by "5" pixels.
6. With Paint Bucket tool still selected, fill in the circular selection with color of choice. (This tutorial Hex Color: #00adef).



7. Goto Select > Modify > Contract. Contract by "5" pixels.
8. Select the Gradient tool.



9. Set the gradient white to the color you used in Step 6. (Hex Color: #ffffff - #00adef).



10. In the options bar, make sure that the gradient is set to "Radial Gradient".



10. Using the Gradient tool, drag from the top right area to the bottom left area of the circular selection.



10. Click Ctrl+D to deselect.
11. Right click the "Circle" layer in the layers palette. Choose "Blending Options".
12. Select "Stroke". Adjust the properties to the following:
(For best effects, make sure the color for the stroke is a grey color. In this tutorial, Hex Color: #898989).



13. Click OK to close out and return to your image.



14. Select the Type tool. Add any text or images that you want in the content circle.