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 

SOLUTION

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 

WHY THIS WOULD BE AWESOME

  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
  • Luke Dorny commented
    November 14, 2018 19:07

    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.

  • Christoffer Furnes commented
    November 23, 2018 10:06

    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!

  • Alex Furgiuele commented
    06 Mar 09:46

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

  • José Ernesto Rodríguez commented
    30 May 19:17

    💯 Would be great for all those icons!