Media
Content-imagery primitive: lazy by default, layout-stable via
| Prop | Type | Default | Description |
|---|---|---|---|
| alt* | string | — | Accessible description. REQUIRED so authors make an explicit call — pass an empty string (`alt=""`) only for purely decorative imagery, which also removes it from the a11y tree. |
| src* | string | — | Image source URL. |
| aspectRatio | string | — | CSS `aspect-ratio` (e.g. `'4/3'`, `'16/9'`, `'1/1'`). Reserves the box before the image loads, so layout never shifts. Omit to use the intrinsic ratio. |
| className | string | — | — |
| fallback | ReactNode | — | Rendered in place of the image when the source fails to load. Keeps the same box (radius / shadow / aspect-ratio) so the layout holds. |
| fit | enum | 'cover' | — |
| fullWidth | boolean | true | Stretch to the container's width. |
| loading | enum | 'lazy' | Native loading hint. |
| radius | enum | 'none' | — |
| ref | Ref<HTMLImageElement> | — | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs} |
| shadow | enum | 'none' | — |
| style | CSSProperties | — | — |
| sx | Sx | — | Theme-aware inline style. |