Skip to main content
H
hannaha68987178
Inspiring
March 26, 2020
Answered

Exporting SVGs with gradient along a stroke

  • March 26, 2020
  • 2 replies
  • 3358 views

I see from a post in 2018 that this wasn't possible. Is that still the case? I am trying to export the following icon as an SVG, maintaining the stroke as requested by the developer. It automatically rasterizes it if the gradient goes along the path. If the gradient runs across the shape as a whole it doesn't cause a problem.

This topic has been closed for replies.
Correct answer Monika Gause

SVG does only support gradient inside a stroke, not along or across. If the developer want the gradient along the stroke, then maybe like this: https://gist.github.com/mbostock/4163057

2 replies

Monika Gause
Community Expert
Monika GauseCommunity ExpertCorrect answer
Community Expert
March 26, 2020

SVG does only support gradient inside a stroke, not along or across. If the developer want the gradient along the stroke, then maybe like this: https://gist.github.com/mbostock/4163057

    marliton
    Community Expert
    marlitonCommunity Expert
    Community Expert
    March 26, 2020

    Hi. It's common to have problems with gradients when you export to SVG format. You can simplify the element or export it to another format like PNG.

    Marlon Ceballos
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices