History

Trinh Ngoc Tu 6a1f89adeb First version with simple frontend and Compose Email by AI		2024-11-29 21:36:41 +01:00
..
dist	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
lib	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
lib-commonjs	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
CHANGELOG.md	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
LICENSE	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
package.json	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00
README.md	First version with simple frontend and Compose Email by AI	2024-11-29 21:36:41 +01:00

README.md

@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:

yarn start
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.