Image

Overview

The Image component displays images from various sources. Uniwind provides className prop support for styling this component.

Styling Convention

For style props: Use regular Tailwind classes directly (e.g., className="p-4").For non-style props (like tintColor): Use the accent- prefix (e.g., tintColorClassName="accent-blue-500").

Since 1.6.2: Passing a className without the accent- prefix to a color prop will log a warning to the development console.

Uniwind Bindings

string

Maps to the style prop. Use any Tailwind utility classes.

string

Maps to the tintColor prop (tints all non-transparent pixels of the image). Requires accent- prefix for color values.

Usage Example

import { Image } from 'react-native'

<Image
  source={{ uri: 'https://example.com/image.png' }}
  className="w-24 h-24 rounded-lg"
  tintColorClassName="accent-blue-500 dark:accent-blue-400"
/>

React Native components

Other components

Overview

Styling Convention

Uniwind Bindings

Usage Example

​Overview

​Styling Convention

​Uniwind Bindings

​Usage Example

Overview

Styling Convention

Uniwind Bindings

Usage Example