Tag
Tag description.
Props
Tag properties
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| color | Color of tag | string | #BB65FF | |
| size | Size of tag | small medium large | small |
Usage
Basic Tag
import { Tag, BrowserWindow } from 'camara';render(<BrowserWindow docs><Tag>Tag</Tag></BrowserWindow>);
Example
import { Flex, Tag, BrowserWindow } from 'camara';render(<BrowserWindow docs><Flex><Tag color="#e61b1b">red</Tag><Tag color="#0099FF">blue</Tag><Tag color="#9b069b">purple</Tag><Tag color="#ff6347">tomato</Tag><Tag color="#068d6b">teal</Tag></Flex></BrowserWindow>);
Size
import { Box, Flex, Tag, BrowserWindow } from 'camara';render(<BrowserWindow docs><Box>{/* large */}<Flex><Tag size="large" color="#e61b1b">red</Tag><Tag size="large" color="#0099FF">blue</Tag><Tag size="large" color="#9b069b">purple</Tag><Tag size="large" color="#ff6347">tomato</Tag><Tag size="large" color="#068d6b">teal</Tag></Flex>{/* medium */}<Flex><Tag size="medium" color="#e61b1b">red</Tag><Tag size="medium" color="#0099FF">blue</Tag><Tag size="medium" color="#9b069b">purple</Tag><Tag size="medium" color="#ff6347">tomato</Tag><Tag size="medium" color="#068d6b">teal</Tag></Flex>{/* small */}<Flex><Tag size="small" color="#e61b1b">red</Tag><Tag size="small" color="#0099FF">blue</Tag><Tag size="small" color="#9b069b">purple</Tag><Tag size="small" color="#ff6347">tomato</Tag><Tag size="small" color="#068d6b">teal</Tag></Flex></Box></BrowserWindow>);