Handles both raster and vector assets. The renderer detects format from the file extension at render time — the author only writes src, w, and h.
img
tagimage & vectorHandles both raster and vector assets. The renderer detects format from the file extension at render time — the author only writes src, w, and h.
The name attribute carries the Figma layer name. fit controls image scaling within the bounding box.
| Attr | Type | Description |
|---|---|---|
name | string | |
src required | asset | |
x | number | |
y | number | |
w required | number | 'fill' | Required on img — no content to derive size from |
h required | number | 'fill' | Required on img — no content to derive size from |
fit | fill none cover contain | |
radius | number | string | |
corner-smoothing | number | |
border | string | |
border-color | color | token | |
border-width | number | |
border-style | solid dashed dotted | |
border-align | center inside outside | |
object-position | string | |
image-rendering | auto pixelated crisp-edges |
Example
<img name="Hero Image" src="assets/hero.webp" w="390" h="240" fit="cover" /> <img src="assets/avatar.webp" w="48" h="48" radius="24" fit="cover" /> <img src="assets/icon-check.svg" w="20" h="20" />