ContextQMD
Back to Tamagui

Image

code/tamagui.dev/data/docs/components/image/1.13.0.mdx

1.144.4838 B
Original Source
<HeroContainer noPad> <ImageDemo /> </HeroContainer>
tsx

<Highlights features={['Supports SSR.', 'Works on native and web.', 'Accepts Tamagui style props.']} />

Installation

Image is already installed in tamagui, or you can install it independently:

bash
npm install @tamagui/image

Usage

Note that you need to set source like so - the width and height properties apply as styles around the image, but the actual image needs source.width and source.height for React Native:

tsx
export default () => (
  <Image
    source={{ width: 200, height: 200, uri: 'https://...' }}
    width="100%"
    height="100%"
  />
)

API Reference

Image

Tamagui props + React Native Web Image props.