How to make Blurry Edged Pix for your Page
CrowDesigns Photoshop Tip

(This page takes a bit to load, I know. There are a lot of pictures on it)

Final

Ok, many people seem to want to know how to do this. It's very easy if you have Photoshop. I've seen a lot of complicated tips elsewhere, but this one works for me. Just follow these steps, and you can do it in a few minutes.


Step 1: Open the picture you want to blur.   Click on: Image / Image Size to get the current Width and Height of your picture. May want to write them down if your memory is as bad as mine Then close the Image Size window.

Start


Step 2:  Next, click on: File / New and make it a bit larger than the picture.  Don't worry about exact size at this point. You can make the background color the color of your web page - I chose white for this example on a white page. If you choose a custom color, you can enter the exact R-B-G values. Keep in mind, if you're doing a commercial page where you want everybody to be able to view it, some of them may not have Hi-Res, Hi-Color capabilities. This site? Sure.....

New


Step 3:  Click on your original picture, click: Edit / Select All (or press Ctrl / A), Edit / Copy (or Ctrl / C) and then click on the NEW, blank window, and Edit / Paste (or Ctrl / V)  your image into the new window. It should automatically center itself.

Paste


Step 4:  Now, choose the Magic Wand, and click once in the white area to select the area around the image. You'll see marching ants around the picture and the border, meaning, you've chosen the correct area.


Step 5:  Click on: Select / Modify / Expand and choose a value that extends into the picture. On this particular pic, I've chosen 8. (Hint: when you're done with the process, don't close out of Photoshop so you can go back and redo it. Especially if you're using version 5 or above, as you can backstep with the History tab.)

Select


Step 6:  Now, click on:  Select / Feather and choose something like 3 for a value. (See Hint, above)


Step 7:  Click on:  Filter / Blur / Gaussian Blur and select a value that looks good as you preview.

Blur

 Blur
(Preview Window)


Step 8:  Now, using the Crop tool, trim your photo, leaving a bit of white space (or the color you've chosen as a background) around the blur to blend into the page.   Don't give up yet, you're almost there.

Crop


....and, Voila - The finished product
Final
(Me and the Peterbilt, someplace cold, long ago and far away)

Now you have your picture. Optimize it for the web to reduce the file size, and you're in biz.  Told you it was easy.



Here's one with Black as the background color.
(Oh, man, how'd you make it OVAL? And what's with the vertical text?)

Hope this does it for you. Any questions, feel free to email me.