Overview
Installation
npm install @rhds/elementsUsage
<rh-tag color="blue">Blue</rh-tag>Variants
With Icon
<rh-tag color="blue" icon="web-icon-alert-danger">Blue label</rh-tag>Colors
Slots
icon-
Contains the labels's icon, e.g. web-icon-alert-success.
- Default Slot
-
Must contain the text for the label.
Attributes
icon- DOM Property
icon- Type
-
string | undefined - Default
-
unknown
variant- DOM Property
variant- Type
-
'filled' | undefined - Default
-
unknown
color- DOM Property
color- Type
-
TagColor | undefined - Default
-
unknown
Methods
None
Events
None
CSS Custom Properties
| CSS Property | Description | Default |
|---|---|---|
--rh-tag-padding-block-start |
4px |
|
--rh-tag-padding-inline-end |
8px |
|
--rh-tag-padding-block-end |
4px |
|
--rh-tag-padding-inline-start |
8px |
|
--rh-tag-margin-inline-end |
4px |
CSS Shadow Parts
icon-
container for the label icon
Red Hat legal and privacy links
- About Red Hat
- Jobs
- Events
- Locations
- Contact Red Hat
- Red Hat Blog
- Diversity, equity, and inclusion
- Cool Stuff Store
- Red Hat Summit
Red Hat legal and privacy links
