Inspiring

Question

how I can make an image under side diagonal in photoshop 2024?

Forum|Forum|1 year ago
September 19, 2024
3 replies
797 views

hello,

I want to make the image under side diagonal as you see in screenshot . I made it in css but there is some problem with some function of performance plug in that I use. this Hero image is of my website ?

please tell me the most simpel way to achieve my goal.

thanks

Web

This topic has been closed for replies.

jane-e

Community Expert

I want to make the image under side diagonal as you see in screenshot . I made it in css

By @johannes999

Can you confirm what you are trying to do? When I read your post, I interpreted it that you want to create an image in the area at the bottom that is currently white.

If so, create a Clipping Mask. Details here:

https://helpx.adobe.com/photoshop-elements/using/clipping-masks.html

Also, by "css" do you mean cascading style sheets or is it a typo? If you meant CSS, that's a different answer.

Jane

J

johannes999Author

Inspiring

thanks every one ,

1-the answer for Jane it is cascading style sheet.

2-I have used ctrl-t then distort ,it worked but now I can not cut the rest of the image the blank space , I used pen to make selection but I don't know how to cut the rest of the image. the cut tool is not working because under side of the image is diagonal . can you tell me which way is the most simpel way to remove the rest of the image after distorting it. I upload screenshot so you can see what I mean!but I see the screenshot the rest of the distort image is not vissible as it is in photshop.

thanks

Conrad_C

Community Expert

Do you mean you want to remove the white area at the bottom so that it’s transparent on the web page? If thh Layers panel has a Background layer, then the document is opaque. If the Background layer is blank, then you can simply delete it, but if the Background layer has content you want to keep, then convert the Background layer to a normal layer and then delete the white. You can try steps like these, shown in the demo below:

1. In the Layers panel, click the lock icon to convert the opaque Background layer to a normal layer that supports transparency.

2. Select the white area using any selection tool or method that works fast. I used the Magic Wand tool because the area is solid white so I only needed one click, but you can also use your method of drawing with the Pen tool and converting the resulting path into a selection.

3. Delete the selection. You can press the Delete key; I chose Edit > Clear just so you could see what I did. Then deselect the selection.

If you see a checkerboard pattern in the deleted area, that indicates document transparency.

4. Save the document in a web image file format that supports transparency, such as PNG.

Conrad_C

Community Expert

The formal way is to choose

Edit > Transform > Perspective

or

Edit > Transform > Distort

and then drag a corner handle.

But in practice, I like and use the method Bojan suggested (Edit > Free Transform with modifier keys), because it means I only have to remember one command, and Edit > Free Transform has a keyboard shortcut.

Bojan Živković11378569

Community Expert

In Photoshop, use Free Transform (Ctrl + T), then hold down Ctrl to distort each individual handle, or right-click and choose an option like Distort, Perspective, etc.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded