#<svg>

<svg> is the cornerstone element for embedding Scalable Vector Graphics (SVG) directly within your markup. It empowers you to craft crisp, resolution-independent illustrations—ranging from simple icons to complex data visualizations—that scale flawlessly across every screen size and pixel density without loss of quality.

#Usage

#Basic

Below is a basic usage example of the <svg> element:

svgsrc/base/index.tsx

Preview

#Supported SVG Tags

The following SVG tags are fully supported:

#Supported SVG Attributes

The following attributes can be applied to the above tags:

#Attributes

#content

content?: string;

SVG XML content

#src

src?: string;

SVG resource URL

#Events

Frontend can bind corresponding event callbacks to listen for runtime behaviors of the element, as shown below.

#bindload

bindload = (e: BaseEvent) => {};

SVG Loaded

#Compatibility