Skip to Content

Image

Lazy-loads by default; fallback renders when the source fails.

SampleBroken
import { Image } from '@gg-software/ui'; <Image src="/photos/team.jpg" alt="Team" width={200} height={120} rounded /> <Image src={url} alt="" fallback={<Placeholder />} lazy={false} />

Props

PropTypeDefaultDescription
src*string
altstring
widthstring | number
heightstring | number
roundedbooleanfalse
fallbackReactNode
lazybooleantrue
classNamestring

* required · generated from packages/ui/src/display/Image/Image.tsx