BackgroundImage
BackgroundImage places content over an image-filled container.
Source
LLM docs
Package
Examples
1
Properties
82
Basics
BackgroundImage places content over an image-filled container.
Loading demo…
import { BackgroundImage, Text } from '@plocks/ui';
const image =
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAALklEQVR42mNITvsIR409P+CIAasokMuAVRQqgSkKksAqiiKB5goGrKJQCawuBgC2Wnfh+zNA9wAAAABJRU5ErkJggg==';
export function Demo() {
return (
<BackgroundImage
src={image}
alt="Abstract color field"
h={140}
p="md"
justify="center"
radius="lg"
>
<Text fw="bold">Content over an image</Text>
</BackgroundImage>
);
}React Native design for iOS, Android, and Web.
Quick Links
Resources