import { Meta } from '@storybook/addon-docs';

<Meta title="Components/Image/Image" />

# Image

Image fields are used to display images, such as photos, screen captures, and diagrams. 

Images should:
- Be clear and easy to read if text is included. 
- Aim to be one of the five ratios: 1:1, 3:2, 16:9, 21:9, 3:1.

Images should not:
- Include long paragraphs of text over the image. Ideally, when placing text over an image, the text contrast ratio should meet [AA standards](https://www.w3.org/WAI/WCAG21/Techniques/general/G18).
- Be used to represent concepts or capabilities using small and simple graphics. Use an [Icon](./?path=/docs/components-icon--default) instead.

### Required Components

This component can be used independently and does not require additional components. 

### Accessibility

#### Screen Readers

This component uses the following attributes to assist screen readers:
- The **`alt`** attribute specifies an alternate text for the image.