Leave Yamada UI a star

Star
Yamada UIYamada UIv1.5.4

Tag

Tag is a component used to categorize or organize items using keywords that describe them.

Source@yamada-ui/tag

Props

TagProps

colorScheme

Description

The visual color appearance of the component.

Type

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

Default

"primary"

isDisabled

Description

If true, the tag is disabled.

Type

boolean

Default

false

leftIcon

Description

Icon to be displayed to the left of the tag.

Type

ReactElement<any, string | JSXElementConstructor<any>>

onClose

Description

Function to be executed when the close button is clicked.

Type

MouseEventHandler<HTMLElement>

rightIcon

Description

Icon to be displayed to the right of the tag.

Type

ReactElement<any, string | JSXElementConstructor<any>>

size

Description

The size of the Tag.

Type

"sm" | "md" | "lg"

Default

"md"

variant

Description

The variant of the Tag.

Type

"outline" | "solid" | "subtle"

Default

"subtle"

Edit this page on GitHub

PreviousData DisplayNextBadge