wwwwwwwwwwwwwwwwwww
Introduction
Installation
Releases

Compiler

Intro
Install
Benchmarks

Core

Configuration
Themes
Props
styled
Variants
Animations
Stack & Text
Theme
useMedia
useTheme
FontLanguage
Extras

Tamagui

Stacks
Headings
Paragraph

Forms

Button
Text Inputs
Label
Progress
Select
Slider
Switch

Panels

AlertDialog
Dialog
Popover
Sheet
Tooltip

Content

Avatar
Card
Group
Image
ListItem

Visual

LinearGradient
Separator
Square & Circle

Etc

Anchor
HTML Elements
ScrollView
Spinner
Unspaced
VisuallyHidden

Extras

Feather Icons

Guides

Design Systems
Developing
Next.js
Expo
Vite
create-tamagui-app

Community

Blog
GitHub
Twitter
Discord

Shapes

Easy to use Square and Circle.

Features

  • Accepts size props as number or token value.

  • Sets min and max width and height.

Usage

Tamagui supports sizing shapes using your size tokens, or plain numbers.

import { Circle, Square } from 'tamagui'



export default () => (

  <>

    <Square size="$4" />

    <Square size={100} />

    <Circle size="$4" />

    <Circle size={100} />

  </>

)

Shape props

Buttons extend Stack views inheriting all the Tamagui standard props, plus:

Props

  • size

    string | tokens.size

    Set a size, number or one of the size token values.

  • circular

    boolean

    Rounds the border radius to be circular.

    • Previous

    Separator

    Next

    Anchor

    Edit this page on GitHub.