zoomable image
click-to-zoom image component with medium.com-style lightbox. powered by react-medium-image-zoom.
examples
click the image to zoom in, click again or scroll to close.
installation
bash
1npx shadcn@latest add https://ui.inference.sh/r/zoomable-image.jsonusage
tsx
1import ZoomableImage from '@/components/zoomable-image'23export function MyImage() {4 return (5 <ZoomableImage6 src="/images/photo.jpg"7 alt="A beautiful landscape"8 className="rounded-lg"9 />10 )11}props
| prop | type | default |
|---|---|---|
| src | string | - |
| alt | string | "" |
| disabled | boolean | false |
| zoomSrc | string | - |
| zoomMargin | number | 16 |