Button

A simple, sizable button.

import { Button } from 'tamagui'

export default () => <Button>Lorem ipsum</Button>
Copy

Sizing buttons provides a unique challenge especially for a compiler, because you need to adjust many different properties - not just on the outer frame, but on the text wrapped inside. Tamagui supports adjusting the padding, border radius, font size and icons sizes all in one with the size prop.

import { Button } from 'tamagui'

export default () => <Button size="$6">Lorem ipsum</Button>
Copy

Given your theme defines a size 6, the button will adjust all of the properties appropriately. You can also pass a plain number to get an arbitrary size.

You can pass icons as either elements or components. If passing components, Tamagui will automatically pass the size and color prop to them based on your theme.

Button extends View, inheriting all the Tamagui standard props, plus: