Jump to content
You must now use your email address to sign in [click for more info] ×

Blending image into solid background with fade and transparent gradient


Recommended Posts

Hey, 

Can Affinity Designer blend an image into a solid background color (thereby extending the image) as you can see done in the attachment?  If so, how?  If not, can affinity photo do this?  Also, what is this actually called? 

banner0.jpg

Link to comment
Share on other sites

  • Staff

Hi designer,
Welcome to Affinity Forums :)

Yes, both apps can do this easily (there's also various methods to achieve it). In Affinity Designer you can simply draw a black rectangle over the image (with the same size of it extending just the side you want - enable snapping to help you align the two), then use the Transparency Tool (the glass cup icon) to apply a linear transparency to the rectangle dragging the tool over the rectangle on the canvas. Adjust the midpoint (the small vertical line in the middle of the transparency handle) to control the "feathering transition" from the black rectangle to the image. Let me know if you still have trouble.

Link to comment
Share on other sites

3 hours ago, uncle808us said:

And in Affinity Photo?

Put a rectangle shape over the image, set the fill to black.

 

Apply a gradient fill with A set to Black and C set to Black (white or grey) but with the opacity of C at 0%. B is the midpoint control and controls how the gradient changes from black to clear. The "feathering transition".

 

Drag A B or C to adjust. You can also apply more control points by clicking on the gradient line, which will give you more control handles (circles) and more midpoint controls. A multi gradiated (?) gradient.

overlay.jpg

P.S it looks rather faded in the middle because I dragged it so far to the right.

Windows PCs. Photo and Designer, latest non-beta versions.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.