Image management does not support SVG mesh gradients?

I’m the first to admit I don’t know much about SVG… All I wanted was a pretty gradient to use as a background. Since I was in Perspective, I figured i should learn to draw some SVG’s. So I downloaded Inkscape, installed with all the defaults and drew a rectangle, clicked Object, Fill and Stroke, and chose one the gradients and saved it as rect.svg.
Dragged it into the Image Management tool and got a little icon with a red X in it.
Went back to inkscape and File, New and made a circle, chose a linear gradient red to blue. Dragged that over and Voila! it showed up and and I was able to assign it to a image component.
Edited rect.svg and noted that I had picked a mesh gradient, so I changed it to linear and now it works too.
What’s my question?? I like the mesh - it looks cool… can it be made to work? Am I doing something wrong? (I’m not doing much, so maybe I need to do something different?)

If you just want a gradient, see this (while this is for a button the idea is still the same),

Example view with gradient background:

  "custom": {},
  "params": {},
  "props": {},
  "root": {
    "meta": {
      "name": "root"
    "props": {
      "style": {
        "background-image": "linear-gradient(red, yellow)"
    "type": "ia.container.coord"

i remeber someone else had a problem because the gradient wasnt constructed good.
perspective has gradients, can you post the json of you svg after importing it to ignition?

If I knew where Ignition kept them, I could - but I don’t. The original is:

Interesting. That SVG doesn’t display in my FireFox. Just a big blank space.

Same in Chrome

1 Like

Blank in my chrome as well

Huh… I hit the upload button and selected the file… it shows as
"! rectmesh|353x500](upload://9crNWQYdyvvqs1ypsdw1GEMlBUV.svg)

on my reply box (I added a space after the exclamation point for display purposes)
then it says: uploading… then that message goes away and I posted it.

Any road, I wouldn’t lose any sleep over it, I’d hoped there was a simple answer like, “Nope you can’t use mesh gradients - get over it” but thanks anyways folks!

The image is there, it just doesn’t render.

Here is the actual markup for it.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape ( -->
<svg xmlns:inkscape=""
     viewBox="0 0 210 297"
     inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
  <defs id="defs11493">
  <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1">
    <rect style="fill:url(#meshgradient17780);stroke-width:0.264583;fill-opacity:1" id="rect11980" width="84.239998" height="102.06" x="56.699997" y="98.279999"/>

This id does not exist (in the svg defs), so no wonder its empty.
Also you should use px and not mm

Well, don’t look at me… As I mentioned, I installed inkscape with all defaults. Opened it, on the blank page that came up I drew a rectangle, clicked Fill and Stroke and added a mesh gradient as fill, then saved it.
I guess that shows that some tweaks are necessary from the default installation?