How do I change a rectangular image into a rounded rectangular image?

[jenniferr67082804]

I have a single image that I just want to convert into a rounded rectangle image. I have watched the tutorials but cannot get the desired outcome I want. In an old version of Photoshop I was able to use vector mask to do so. Now I can't figure out how to do it. I made over a hundred rounded rectangle shapes a couple years ago but I cannot seem to duplicate this process in the updated Photoshop.

[joanH]

Hi jenniferr6782804.

In Photoshop there are several ways but I will give you the most simple one. First, make the card larger with free-transform.

Use the circle selection tool and draw a circle inside of the four sides of the card.

then select inverse to select outside the circle. Then delete everything outside of the circle. Under the edit, drop-down select Free transform and make the circle as large as you want it. Let me know if that is what you needed to do.

Best regards. JH

[Bojan Živković]

Here are the steps to create vector mask (Photoshop CC latest version):

• Activate Rounded Rectangle Tool.
• From the Options bar which is just below menus choose Path from the first drop down list.
• Draw path and adjust corners as needed using Window > Properties panel.
• Ensure that layer with image for which you want to round corners is selected in the Layers panel and click Mask button in the Options bar.

[jenniferr67082804]

I tried this approach and in Photoshop it looks great. When I post it on the website I am working in, it didn't transfer, the image is still rectangular. I did save the work that I did based on your instructions.  I feel like I am probably making this harder than it really is.

[Norman Sanders]

Save the file as png

[Bojan Živković]

What is the background color of your site? If you have a white background color and you upload image with white background, despite of rounded corners your image will look rectangular.

[jenniferr67082804]

It's light grey.

[John Waller]

The background colour of your image (outside the rounded rectangle) needs to match the light grey background colour of your page to complete the illusion.

[Norman Sanders]

Choose the Rounded Rectange Tool (a Shape tool option). It is located above the Hand Tool. In its Options bar, choose Shape, Fill:Black, Stroke: Blank)

Draw the rounded rectangle

In the Layers panel, place the Rounded Rectangle layer below the image layer.

Return to the top layer and choose Layer > Create Clipping Mask

(Note: In the Options bar you can also change the radius of the rounded corners)

[DaveJCummings]

Everyone else beat me to it