Jump to content
rchrdnsh

Can i create a gradient that follows a path?

Recommended Posts

There are radial, linear, elliptical and conical gradient types, but is it possible to create a subtle curved path and have the gradient follow that shape? That would be just awesome if that exists :-)

Share this post


Link to post
Share on other sites

In fact, clunky is very well describing. The gradient doesn't just follow the path but is somehow more kind of masking the path. I'd like this gradient to start at the 1st node the line and end at the last.
 
Any suggestions?

post-27232-0-03000900-1457683741_thumb.png

Share this post


Link to post
Share on other sites

No, this isn't possible at the moment unless you go to the trouble of making a gradient texture to use in a vector brush... We have much grander plans when it comes to gradients and I'm not prepared to mention what it is right now because it won't be as much fun when we do the big reveal in the future if you already knew what was coming! ;)

Share this post


Link to post
Share on other sites

hmmmm...i think i asked this incorrectly then...i don't want to create a path, but actually create a shape with a curvy side and have the gradient shoot outwards from the curvy side in the same shape as the curvy side...i don't really know how to explain this better...

 

like....i want to make a rectangle, but one of the sides of the rectangle would be ark-ed, either convex, or concave, then i want to apply a linear style gradient to the rectangle, but the gradient would alter it's shape to follow the curve of the ark-ed side, rather than just be linear...

 

I hope that makes sense a little bit better...

Share this post


Link to post
Share on other sites

Since ya didn't specify :rolleyes:  .... You can do some cool stuff with the warp tool in AP.

Of course, it's raster, totally destructive AND I'm pretty sure you meant is there a way in Deisgner.

 

post-12544-0-52423500-1460243909_thumb.png

Share this post


Link to post
Share on other sites

How complex is your gradient going to be? If it's as simple as one colour fading out into transparency, you can use the Inner Shadow effect. That will follow the curve exactly.

 

Hmm, maybe not. Painting one by building it up using a masked pixel layer seems to be the best way so far until the new super gradient goodies come out:

 

post-559-0-45359300-1460338827_thumb.png


MacBook Pro 15" 32GB RAM, iPad Pro 12.9" + Magic Keyboard, Apple Pencil.  Software tools of my trade: Affinity Designer | Affinity Publisher | PDF Expert | Drafts | The Archive | Plutio  

https://eandrpublications.com.au

Share this post


Link to post
Share on other sites
On 3/11/2016 at 9:19 AM, MattP said:

No, this isn't possible at the moment unless you go to the trouble of making a gradient texture to use in a vector brush... We have much grander plans when it comes to gradients and I'm not prepared to mention what it is right now because it won't be as much fun when we do the big reveal in the future if you already knew what was coming! ;)

Hello,

I didn't find any update on this topic since 2016, and also no other informations anywhere else on that matter. Is this feature already implemented or is it still to come?

Thank you very much in advance for your update!

Antoine

Share this post


Link to post
Share on other sites

There is no gradient on a path - yet.

You'd have to find a workaround.


Win10 Home x64   |   AMD Ryzen 7 2700X @ 3.7GHz   |   16 GB RAM   |   1TB SSD   |   nVidia GTX 1660   |   Huion 1060 Plus

How I make GIFs >>> ScreenToGIF (Windows only, Open Source, Portable, ~600kB)

Share this post


Link to post
Share on other sites

For context, which app are you using mr OP?


iMac 27" Late 2015 Fully Loaded, iMac 27" Mid 2011 both running High Sierra 10.13.6 - Affinity Designer/Photo & Publisher - Illustrator CC, Inkscape, Blender, Sketchup, Pepakura Designer, MTC, Pixelmator & Pixelmator Pro + more... XP-Pen Artist-22E, - iPad Pro 12.9 B|  

Affinity Help - Affinity Desktop Tutorials - Feedback - FAQ - most asked questions

Share this post


Link to post
Share on other sites
2 minutes ago, firstdefence said:

For context, which app are you using mr OP?

He last visited the forum more than 3 years ago, so it's unlikely he'll answer :)

Share this post


Link to post
Share on other sites

I don't know if that would suit you:

Draw the shape, put a fill color and one to the outline.
Put a "Gaussian Blur" effect by checking "Preserve Alpha".
Put an external "Outline" fx, choose the color, adjust the thickness.

Gradient on path.jpg

Share this post


Link to post
Share on other sites
5 minutes ago, anon2 said:

He last visited the forum more than 3 years ago, so it's unlikely he'll answer :)

Knock once for yes, twice for no lol!


iMac 27" Late 2015 Fully Loaded, iMac 27" Mid 2011 both running High Sierra 10.13.6 - Affinity Designer/Photo & Publisher - Illustrator CC, Inkscape, Blender, Sketchup, Pepakura Designer, MTC, Pixelmator & Pixelmator Pro + more... XP-Pen Artist-22E, - iPad Pro 12.9 B|  

Affinity Help - Affinity Desktop Tutorials - Feedback - FAQ - most asked questions

Share this post


Link to post
Share on other sites
2 hours ago, Aammppaa said:

There is no gradient on a path - yet.

You'd have to find a workaround.

Thank you for this info. I guess I'll stick with old Illustrator CS6 for some work until it comes...

Share this post


Link to post
Share on other sites

Can you post an image of what you´re trying to achieve - so we can see how close we can get with AD.

I still thought it was about a "gradient following a path": 😀

gradientonpath.png.2712acc4082b806a98a9a40d4e26ad2d.png

Share this post


Link to post
Share on other sites
10 hours ago, PixelPest said:

Can you post an image of what you´re trying to achieve - so we can see how close we can get with AD.

I still thought it was about a "gradient following a path": 😀

gradientonpath.png.2712acc4082b806a98a9a40d4e26ad2d.png

My question is about a «  gradient following a path ». Your image is what i try to achieve, whatever the shape of the curve is. Thanks for the clarification.

Share this post


Link to post
Share on other sites

In this case you can create a vector brush.
Depending on the color scheme the gradient will be parallel or perpendicular to the line.

Stroke gradient.jpg

Share this post


Link to post
Share on other sites
23 hours ago, PixelPest said:

Can you post an image of what you´re trying to achieve - so we can see how close we can get with AD.

I still thought it was about a "gradient following a path": 😀

gradientonpath.png.2712acc4082b806a98a9a40d4e26ad2d.png

FYI it's not going to work in many applications, but in the example shown it can be pretty well accomplished using a conical gradient for the stroke.

1087593005_ScreenShot2020-03-09at2_52_39PM.png.c521db5b237c16772ade2ed3c6eb70d0.png


iMac (27-inch, Late 2009) with macOS Sierra

Share this post


Link to post
Share on other sites
On 3/9/2020 at 2:47 AM, PixelPest said:

Can you post an image of what you´re trying to achieve - so we can see how close we can get with AD.

I still thought it was about a "gradient following a path": 😀

gradientonpath.png.2712acc4082b806a98a9a40d4e26ad2d.png

how to do this?

Share this post


Link to post
Share on other sites
On 3/9/2020 at 1:53 PM, G13RL said:

In this case you can create a vector brush.
Depending on the color scheme the gradient will be parallel or perpendicular to the line.

Stroke gradient.jpg

how to do this?

Share this post


Link to post
Share on other sites

Hello AhmedThahir,

Create a drawing with the colors (rainbow in my example), apply a "Gaussian Blur" fx to it (check "Preserve Alpha") and export it as a png (the selection alone).
Duplicate the drawing, rotate it by 90° and export it if you want to have the choice of gradient as in my screenshot.
To create the brush, in the "Brushes" tab of the studio, expand the "Hamburger" to the right of the name, choose "New Textured Image Brush" in the drop-down list, select the PNG file, click on "Open", the brush will be created in the displayed category. Proceed in the same way for the second brush.

2020-04-14_163746.jpg

Share this post


Link to post
Share on other sites
1 hour ago, G13RL said:

Hello AhmedThahir,

Create a drawing with the colors (rainbow in my example), apply a "Gaussian Blur" fx to it (check "Preserve Alpha") and export it as a png (the selection alone).
Duplicate the drawing, rotate it by 90° and export it if you want to have the choice of gradient as in my screenshot.
To create the brush, in the "Brushes" tab of the studio, expand the "Hamburger" to the right of the name, choose "New Textured Image Brush" in the drop-down list, select the PNG file, click on "Open", the brush will be created in the displayed category. Proceed in the same way for the second brush.

2020-04-14_163746.jpg

image.png.e186094b8c3707ae7fc33fa2fa2720a6.png

 

i tried your method but the brush's colour gradient isnt getting applied :(

I got it right with a conical gradient... however, it gets rasterised for svg

Share this post


Link to post
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

Please note the Annual Company Closure section in the Terms of Use. These are the Terms of Use you will be asked to agree to if you join the forum. | 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.