Tag
Draw attention to new or categorized content with tags in several sizes and color styles.
Examples
Default
Breakpoints
Mobile
320pxMobile Lg
480pxTablet
640pxDesktop
1024pxtag-demo.tsx
Large
Breakpoints
Mobile
320pxMobile Lg
480pxTablet
640pxDesktop
1024pxtag-large-demo.tsx
Vivid orange
Breakpoints
Mobile
320pxMobile Lg
480pxTablet
640pxDesktop
1024pxtag-vivid-orange-demo.tsx
Light gray
Breakpoints
Mobile
320pxMobile Lg
480pxTablet
640pxDesktop
1024pxtag-light-gray-demo.tsx
Component API
Tag is a styled text label.
Tag<span>
Accepts native span props.
| Prop | Type | Default | Description |
|---|---|---|---|
variant | default | vivid-orange | light-gray | default | Selects the color treatment. |
size | md | lg | md | Selects the text size. |