Support an SVG-specific Element, as an alternative to the Image element

Currently SVGs can only be added through the Image element, or the Embed element. Both of these approaches have issues, which an SVG-specific element could solve neatly.

SVG via Embed element problems;

  • Embeds are not permitted within links, making menus difficult
  • Embeds cannot be previewed in the designer 

SVG via Image element problems;

  • The SVG cannot be affected by CSS when it is referenced through an <img> tag
  • The currentColor feature of SVGs does not function 
  • Creates a large number of HTTP requests for icon-rich designs 


An SVG Element which...

  1. Works similarly to the Image element in terms of canvas placement and config options
  2. Can be associated with any SVG element in assets
  3. Adds Embed as an option, which will import the SVG content on build
  4. Support additional SVG element options, such as path-id, aria-hidden, focusable, and viewbox 


  1. It would allow SVG's to be used with currentColor, since embedding would be allowed
  2. It would avoid the need for Embeds (which cannot be used in links) 
  3. It would efficiently use embedded / inline data, rather than doing multiple HTTP requests
  4. It would support SVG-specific attributes such as aria-hidden, focusable, and viewbox 
  5. Allow SVG libraries, with path-id referencing
  • Michael Wells
  • Oct 26 2018
  • Reviewed
  • Jacob Williams commented
    8 Jan 09:35pm

    This would be amazing. WE NEED THIS!

  • Nils Kröger commented
    2 Jan 10:08pm


  • Winona Homenick commented
    25 Nov, 2021 07:49am

    Embed an SVG via an <img> element, you just need to reference it in the src attribute as you'd expect. You will need a height or a width attribute

  • Swift Storm commented
    23 Jul, 2021 11:21am

    CSS is supposed to make these tasks faster, but nope, not in webflow, because webflow restrictions. so dumb.

  • Mike Escoffery commented
    25 Mar, 2021 05:09pm

    Please THIS!!!

    There are way too many workaround trying to get SVGs to work as they normally do in a browser without being tied down by webflow. 

    Bottom line - It's currently faster to create 100 Svgs in all different colours that it is to use the embeds and workarounds to get icon links to work.

    CSS is supposed to make these tasks faster, but nope, not in webflow, because webflow restrictions. so dumb.

  • Tansen BEL commented
    11 Dec, 2020 02:42pm

    It would save so much time !

  • Glenn Eastland commented
    11 Sep, 2020 09:47am

    Would be useful. If the SVG is a single colour you can use Opactity and Filters but it's not a great substitute.

  • Ghous Shah commented
    13 Jun, 2020 07:54pm

    Please add this to webflow
    It will save us a LOT OF TIME

  • Leonardo Tanuwijaya commented
    9 May, 2020 11:48pm

    I've been dreading for this feature, would love for this feature to be realised. Webflow has been very important piece in my work and this feature would help a lot

  • Terry Hopper commented
    29 Jan, 2020 05:01pm

    Our site uses SVG extensively/exclusively. I'd especially like to cut down on the HTTP requests. This suggestion sounds perfect.

  • Mariia Kulida commented
    30 Dec, 2019 01:59pm


  • José Ernesto Rodríguez commented
    30 May, 2019 07:17pm

    💯 Would be great for all those icons!

  • Alex Furgiuele commented
    6 Mar, 2019 09:46am

    Please! It is a fundamental thing to be able to manipulate SVG nowadays!

  • Christoffer Furnes commented
    23 Nov, 2018 10:06am

    This would be great feature, as I then could also change the color of the svg icon inside buttons and link blocks when setting button states!

  • Luke Dorny commented
    14 Nov, 2018 07:07pm

    A great addition.

    Icons are currently used in the stock elements for navigation and ecommerce blocks that are essentially inline SVGs.

    Hoping for a feature upgrade soon.

  • +885