Image
Image is a component that displays images.
<Image
src="https://dragon-ball-official.com/assets/img/intro/intro_1.png"
alt="γγ©γ΄γ³γγΌγ«"
boxSize="xl"
/>
Usage
import { Image } from "@yamada-ui/react"
import { Image } from "@/components/ui"
import { Image } from "@workspaces/ui"
<Image />
If your framework provides an image component, extend it with
styled. For integration details, see the documentation for each framework.Use Picture to provide alternative images for different display or device scenarios.
To display a profile picture or an icon with initials representing a user, use Avatar.
To generate and display a QR code from information such as a URL, use QrCode.
Props
Accessibility
Set alt to alternative text that conveys the image's content or purpose. For decorative images that do not convey information, set alt="".
Similar Components
Picture
Picture is a component that uses the picture element to provide alternative images for different display and device scenarios.
AspectRatio
AspectRatio is a component for embedding things like videos and maps while maintaining the aspect ratio.
Icon
Icon is a general icon component that can be used in your projects.
QrCode
QrCode is a component that displays a QR code.
Avatar
Avatar is a component that displays a profile picture or an icon with initials representing a user.