JSPM

@fluentui/react-image

0.0.0-nightly-20250306-0406.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 230772
  • Score
    100M100P100Q163678F
  • License MIT

Fluent UI React Image component.

Package Exports

    Readme

    @fluentui/react-image

    Image components for Fluent UI React

    Usage of Image component ensures consistent styling and behaviour of images in your application based on the Fluent UI Design System.

    Usage

    To import Image:

    import { Image } from '@fluentui/react-components';

    Examples

    <Image src="example_image.png" />
    <Image src="example_image.png" alt="Example image" />;
    <Image src="example_image.png" bordered />;
    <Image src="example_image.png" fit="contain" />;
    <Image src="example_image.png" shadow />;
    <Image src="example_image.png" shape="circular" />;

    See Fluent UI Storybook for more detailed usage examples.

    Alternatively, run Storybook locally with:

    1. yarn start
    2. Select react-image from the list.

    Specification

    See SPEC.md.

    Migration

    If you're upgrading to Fluent UI v9 see MIGRATION.md for guidance on updating to the latest Image implementation.