export const meta = {
  title: 'Amplify UI Components',
  description: 'UI Components and Style Guide',
  disableTOC: 'true',
  filterKey: 'framework',
};

Amplify UI is an open-source design system with cloud-connected components and primitives that simplify building accessible, responsive, and beautiful applications.

import all0 from '/src/fragments/ui/web/installation.mdx';

<Fragments fragments={{ all: all0 }} />

import react_native1 from '/src/fragments/ui/react-native/installation.mdx';

<Fragments fragments={{ 'react-native': react_native1 }} />

import flutter2 from '/src/fragments/ui/flutter/installation.mdx';

<Fragments fragments={{ flutter: flutter2 }} />

## Frameworks

| Framework | Package | Version |
| --- | --- | --- |
| **React** | [`@aws-amplify/ui-react`](https://www.npmjs.com/package/@aws-amplify/ui-react) | [![version](https://img.shields.io/npm/v/@aws-amplify/ui-react/latest.svg)](https://www.npmjs.com/package/@aws-amplify/ui-react) | [`README.md`](../amplify-ui-react/README) | [`React`](#react) |
| **Angular** | [`@aws-amplify/ui-angular`](https://www.npmjs.com/package/@aws-amplify/ui-angular) | [![version](https://img.shields.io/npm/v/@aws-amplify/ui-angular/latest.svg)](https://www.npmjs.com/package/@aws-amplify/ui-angular) | [`README.md`](../amplify-ui-angular/README) | [`Angular`](#angular) |
| **Vue** | [`@aws-amplify/ui-vue`](https://www.npmjs.com/package/@aws-amplify/ui-vue) | [![version](https://img.shields.io/npm/v/@aws-amplify/ui-vue/latest.svg)](https://www.npmjs.com/package/@aws-amplify/ui-vue) | [`README.md`](README) | [`Vue`](#Vue) |
| **Web Components** | [`@aws-amplify/ui-components`](https://www.npmjs.com/package/@aws-amplify/ui-components) | [![version](https://img.shields.io/npm/v/@aws-amplify/ui-components/latest.svg)](https://www.npmjs.com/package/@aws-amplify/ui-components) | [`README.md`](README) | [`Web Components`](#web-components) |
| **React Native** | [`aws-amplify-react-native`](https://www.npmjs.com/package/aws-amplify-react-native) | [![version](https://img.shields.io/npm/v/aws-amplify-react-native/latest.svg)](https://www.npmjs.com/package/aws-amplify-react-native) | [`README.md`](README) | [`Web Components`](#web-components) |
| **Flutter** | [`amplify_authenticator`](https://pub.dev/packages/amplify_authenticator) | [![pub package](https://img.shields.io/pub/v/amplify_authenticator.svg)](https://pub.dev/packages/amplify_authenticator) |