Skip to main content
Question

SVG import/paste with unit width height


forresto

I’m testing copy/paste SVG between Figma and Cuttle.xyz (a new CAD app for laser and CNC cutters).

When you paste SVG text into Figma, it should size it using the width and height of the SVG tag, taking into account the units.

Currently, when you paste into Figma, it uses the width and height for sizing but ignores the units. So if you paste this:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="1in" height="1in" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg" version="1.1">
  <path d="M0 0 L72 0 L72 72 L0 72 L0 0 Z " fill="#808080" fill-rule="evenodd" stroke="none" />
</svg>

It comes in to Figma as a 1x1 rectangle. Instead I would expect it to come in as a 96x96 rectangle since “1in” = “96px” according to the CSS spec.

Same situation with export/import as copy/paste.

2 replies

forresto
  • Author
  • 1 reply
  • April 14, 2021

Just to show something fun, here’s a generative Phyllotaxis composition made in Cuttle, pasted into Figma:

The JS code in Cuttle that makes it:

const PHI = 137.5;

const items = [];
for (let i = 0; i < repetitions; i++) {
  const angle = PHI * i;
  const item = input.clone().transform({
    position: Vec(c * sqrt(i), 0).rotate(angle),
    rotation: angle
  });
  items.push(item);
}
return items;

Robert
  • 20 replies
  • April 14, 2021

Hi,
welcome to the community!

I think Figma doesn’t interpretate values other than numbers inside width/height attributes, so it automatically thinks that the numbers are values in pixels by default.

Even if you try to put cm, mm inside the height/width attributes, Figma still doesn’t convert the values in pixels as it should (Photoshop does it, for example).

That’s what I presume it’s happening.

PS. Cool thing that Phyllotaxis 😯


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings