Draw a Sunburst in Illustrator CS4

Draw a Sunburst in Illustrator CS4
If you haven't noticed the explosion of blogging on the web, you're in the minority. As a web designer, this is another avenue to design for your clients. When a client comes to me with a request for custom blog graphics, I usually start with the header graphic. If the client likes the header, then we move on from there.

In the past there was a hard and fast rule that the header of a website should be in the ball park of 800 x 100 pixels. But with the advancements in image compression and broadband Internet access, the size of headers has grown considerably. I've recently seen headers that were 1600 x 300 and even larger.

As with everything else, finding a place somewhere in the middle works best. Depending of the logo and other preexisting graphics supplied by the client, I usually start with a basic size for my header of 900 x 200 pixels. Let's start there and make a beautiful sunbrust header in Illustrator CS4.

  1. Start a new project file in IllustratorR. Set the Width to 800, Height to 200, Resolution to 72 and Color Mode to RGB.

  2. I like to lock the bottom layer and start on a new Layer 2 in the Layers panel. Let's rename this layer to "sunburst".

  3. Set the Fill to null and the Stroke to black and 1 pt. Set the line to Basic and Style to null. In the Stroke panel, set the Weight to 1pt and the Miter Limit to 4. Using the Ellipse tool, draw a circle with the center aligned at the horizontal center of the header and on the bottom line.

  4. In the Stroke panel, set the Weight to 300 pt. Check the box next to Dashed Line and keep the default setting of 2 pt.

    There is our sunburst. You can save this file in case you ever need a sunburst again. We will copy and paste it into PhotoshopR.

  5. With the circle still selected, click Edit – Copy to copy the circle to the clipboard.

  6. With Photoshop open, click File – New to start a new project. Keep the settings in the New dialog box. They are automatically set to the size of our clipboard image.

  7. Click Edit – Paste to paste the image from the clipboard. In the Paste dialog box, choose Paste As Pixels. Click the checkmark to finalize. Save this as a PSD file.

  8. Now, click File – New to start a new project window at 800 x 200 x 72 x RGB. Copy or drag the sunburst image into this window. Click Edit – Free Transform to adjust the shape of the sunburst. The center should be in the center of the bottom edge and the rays should touch the top of the header. You will want to leave a blank space on both sides of the header.

In the next tutorial, we will experiment with several ways to finish the header design.

Sunburst Header Design in Photoshop

Copyright 2018 Adobe Systems Incorporated. All rights reserved. Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper is/are either [a] registered trademark[s] or a trademark[s] of Adobe Systems Incorporated in the United States and/or other countries.

Related Articles
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map

Content copyright © 2019 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.