Tag #
Standard tag component for categorize content
import { PTag } from 'pearkit';Basic #
Label of the tag is defined with the label property.
New
<PTag label="New" />Colors #
Since we use the tailwind color palette in our design, you can use the names of all tailwind colors as props. For example : sky red indigo
NewNewNew
<PTag color="orange" />Rounded #
Enabling rounded, displays a tag as a fully rounded
New
<PTag rounded />Icon #
You can add a tag icon by passing an icon component to the icon property.
New
<PTag icon={<Icon icon="mdi:check"/>} />Accessibility (Not Ready Yet) #
None
Api #
Here you can see all the working features for the tag component.
| Name | Type | Default | Description |
|---|---|---|---|
| label | string | null | Label of the component |
| color | TwColor | blue | Colors of the component |
| rounded | boolean | true | Fully rounded design of the component |
| icon | ReactNode | null | Icon component of the tag component |