Tamagui

# Tamagui Complete Documentation > Tamagui is a complete UI solution for React Native and Web, with a fully-featured UI kit, styling engine, and optimizing compiler. ## components/accordion/1.0.0 --- title: Accordion description: A vertically stacked set of interactive headings with content. name: accordion component: Accordion package: accordion --- <HeroContainer> <AccordionDemo /> </HeroContainer> ```tsx hero template=Accordion ``` <Highlights features={[ 'Full keyboard navigation.', 'Can expand one or multiple items.', 'Can be controlled or uncontrolled.', ]} /> ## Installation Accordion is already installed in `tamagui`, or you can install it independently: ```bash npm install @tamagui/accordion ``` ## Anatomy Import all parts and piece them together. ```jsx import { Accordion } from 'tamagui' // or '@tamagui/accordion' export default () => ( <Accordion> <Accordion.Item> <Accordion.Header> <Accordion.Trigger /> </Accordion.Header> <Accordion.Content /> </Accordion.Item> </Accordion> ) ``` ## API Reference ### Accordion Contains all the parts of an accordion. <PropsTable data={[ { name: 'asChild', required: false, type: 'boolean', default: 'false', description: 'Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.', }, { name: 'type', required: true, type: '"single" | "multiple"', typeSimple: 'enum', description: ( <span> Determines whether one or multiple items can be opened at the same time. </span> ), }, { name: 'value', required: false, type: 'string', description: ( <span> The controlled value of the item to expand when <Code>type</Code> is{' '} <Code>"single"</