Forms

Using the same base component TextInput , from react-native-web, Tamagui simply wraps these components to allow the full set of style props, as well as scaling all the styles up or down using the size property, much like Button.

Input

A one-line input field:

import { Input } from 'tamagui'

export const App = () => (
  // Accepts size and style properties directly
  <Input size="$4" borderWidth={2} />
)

Textarea

For multi-line inputs:

import { Textarea } from 'tamagui'

export const App = () => (
  // Accepts size and style properties directly
  <Textarea size="$4" borderWidth={2} />
)

Form

A helper element that only has functionality on the web, but falls back to a view on native:

import { Form } from 'tamagui'

export const App = () => (
  <Form>
    {/* ... */}
    {/* form elements here */}
    {/* ... */}
  </Form>
)

Form element props

Form elements extend Stack views inheriting all the Tamagui standard props.

Group

Label

Edit this page on GitHub.

Getting Started

Core

Tamagui

Separate Components

Extras

Guides

Community

Forms

Input

Textarea

Form

Form element props