Streaming live at 10am (PST)

Vector graphics behaving like bitmap graphics

I am curious why .svg’s that I import into Webflow have specific dimensions, and shrink when I check “Image is HiDPI”? Shouldn’t they be behaving as vectors rather than as bitmaps?

Here is a short video that demonstrates what I mean:

If anyone has any insight they can share, that would be helpful and appreciated.

Thanks.


Here is my site Read-Only: https://preview.webflow.com/preview/nymm-2?utm_source=nymm-2&preview=3def8ecb6e85abad358ae527eff5aee2

Why would you click the HIDPI checkbox on an SVG? That should be left off.

@webdev

That’s a good question. I agree there should be no reason to check an HiDIP checkbox on an SVG. What I’m curious about, though, is why the SVG is acting like a bitmap and not an SVG when I check the box? Even without checking the box, the settings indicate that the SVG has a particular specific set of dimensions, which doesn’t make sense to me. Actually, to your question, it would seem like if you import an SVG that there should not even be a checkbox for HiDPI in the settings—is there a reason why there is? Now, this confusion could just be caused by an ignorance on my part regarding SVGs or of Webflow. So, what I’m trying to understand is how Webflow handles vector graphics like SGVs.

Just set the dimensions you want the SVG to be in css or by placing it into a parent element that constrains it. By default an svg in will fill the parent container. While you can specify a value in the “image” dialog it is just probably not the best practice. While an SVG is not an image, I think webflow treats it like one in the designer because of the audience. I could be wrong. I like to embed mine.

@webdev

Thanks for your thoughts.

While you can specify a value in the “image” dialog it is just probably
not the best practice.

Yes, I don’t do that. You can see in the screenshot below I leave those settings to “auto.” But you might notice also in this screenshot that the settings indicate a particular set of dimesions above the boxes where you can specify dimensions, and if you check “Image is HiDPI” it will halve those:

42%20PM

I like to embed mine.

Is that something different than uploading them to the Assets panel?

42%20PM

While an SVG is not an image, I think webflow treats it like one in the
designer because of the audience.

Yeah, confusing. If it’s as it seems to us, maybe it’s something not to worry about but that they could treat a little more logically in their interface in the future.