Label

Examples

Filled

GreyGrey icon Grey removeable Grey icon removeable Grey link Grey link removeableGrey label with icon that overflows

Blue Blue icon Blue removeable Blue icon removeable Blue link Blue link removeableBlue label with icon that overflows

Green Green icon Green removeable Green icon removeable Green link Green link removeableGreen label with icon that overflows

Orange Orange icon Orange removeable Orange icon removeable Orange link Orange link removeableOrange label with icon that overflows

Red Red icon Red removeable Red icon removeable Red link Red link removeableRed label with icon that overflows

Purple Purple icon Purple removeable Purple icon removeable Purple link Purple link removeablePurple label with icon that overflows

Cyan Cyan icon Cyan removeable Cyan icon removeable Cyan link Cyan link removeableCyan label with icon that overflows

Outline

Grey Grey icon Grey removeable Grey icon removeable Grey link Grey link removeableGrey label with icon that overflows

Blue Blue icon Blue removeable Blue icon removeable Blue link Blue link removeableBlue label with icon that overflows

Green Green icon Green removeable Green icon removeable Green link Green link removeableGreen label with icon that overflows

Orange Orange icon Orange removeable Orange icon removeable Orange link Orange link removeableOrange label with icon that overflows

Red Red icon Red removeable Red icon removeable Red link Red link removeableRed label with icon that overflows

Purple Purple icon Purple removeable Purple icon removeable Purple link Purple link removeablePurple label with icon that overflows

Cyan Cyan icon Cyan removeable Cyan icon removeable Cyan link Cyan link removeableCyan label with icon that overflows

Router link

Blue label router link with icon that overflows

Props

Label

Name	Type	Required	Default	Description
children	React.ReactNode	No		Content rendered inside the label.
className	string	No	''	Additional classes added to the label.
closeBtn	React.ReactNode	No		Node for custom close button.
closeBtnProps	any	No		Additional properties for the default close button.
color	'blue' \| 'cyan' \| 'green' \| 'orange' \| 'purple' \| 'red' \| 'grey'	No	'grey'	Color of the label.
href	string	No		Href for a label that is a link. If present, the label will change to an anchor element.
icon	React.ReactNode	No		Icon added to the left of the label text.
isOverflowLabel	boolean	No		Flag indicating if the label is an overflow label
isTruncated	boolean	No	false	Flag indicating the label text should be truncated.
onClose	(event: React.MouseEvent) => void	No		Close click callback for removable labels. If present, label will have a close button.
render	({ className, content, componentRef }: { className: string; content: React.ReactNode; componentRef: any; }) => React.ReactNode	No		Forwards the label content and className to rendered function. Use this prop for react router support.
tooltipPosition	'auto' \| 'top' \| 'bottom' \| 'left' \| 'right'	No		Position of the tooltip which is displayed if text is truncated
variant	'outline' \| 'filled'	No	'filled'	Variant of the label.

CSS variables


	.pf-c-label	--pf-c-label--PaddingTop	0.25rem
--pf-c-label--PaddingTop --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label--PaddingRight	0.5rem
--pf-c-label--PaddingRight --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label	--pf-c-label--PaddingBottom	0.25rem
--pf-c-label--PaddingBottom --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label--PaddingLeft	0.5rem
--pf-c-label--PaddingLeft --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label	--pf-c-label--BorderRadius	30em
--pf-c-label--BorderRadius --pf-global--BorderRadius--lg $pf-global--BorderRadius--lg 30em
	.pf-c-label	--pf-c-label--BackgroundColor	#f5f5f5
--pf-c-label--BackgroundColor --pf-global--palette--black-150 $pf-color-black-150 #f5f5f5
	.pf-c-label	--pf-c-label--Color	#151515
--pf-c-label--Color --pf-global--Color--100 $pf-global--Color--100 $pf-color-black-900 #151515
	.pf-c-label	--pf-c-label--FontSize	0.875rem
--pf-c-label--FontSize --pf-global--FontSize--sm $pf-global--FontSize--sm pf-font-prem(14px) 0.875rem
	.pf-c-label	--pf-c-label__content--before--BorderWidth	1px
--pf-c-label__content--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-label	--pf-c-label__content--before--BorderColor	#d2d2d2
--pf-c-label__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--BackgroundColor	#fff
--pf-c-label--m-outline--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-label	--pf-c-label--m-outline__content--before--BorderWidth	1px
--pf-c-label--m-outline__content--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-label	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label__content--link--hover--before--BorderWidth	2px
--pf-c-label__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label__content--link--focus--before--BorderWidth	2px
--pf-c-label__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label__content--link--hover--before--BorderColor	#8a8d90
--pf-c-label__content--link--hover--before--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 $pf-color-black-500 #8a8d90
	.pf-c-label	--pf-c-label__content--link--focus--before--BorderColor	#8a8d90
--pf-c-label__content--link--focus--before--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 $pf-color-black-500 #8a8d90
	.pf-c-label	--pf-c-label--m-outline__content--link--hover--before--BorderWidth	2px
--pf-c-label--m-outline__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label--m-outline__content--link--focus--before--BorderWidth	2px
--pf-c-label--m-outline__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-blue--BackgroundColor	#e7f1fa
--pf-c-label--m-blue--BackgroundColor --pf-global--palette--blue-50 $pf-color-blue-50 #e7f1fa
	.pf-c-label	--pf-c-label--m-blue__icon--Color	#06c
--pf-c-label--m-blue__icon--Color --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label	--pf-c-label--m-blue__content--Color	#002952
--pf-c-label--m-blue__content--Color --pf-global--info-color--200 $pf-global--info-color--200 $pf-color-blue-600 #002952
	.pf-c-label	--pf-c-label--m-blue__content--before--BorderColor	#bee1f4
--pf-c-label--m-blue__content--before--BorderColor --pf-global--palette--blue-100 $pf-color-blue-100 #bee1f4
	.pf-c-label	--pf-c-label--m-blue__content--link--hover--before--BorderColor	#06c
--pf-c-label--m-blue__content--link--hover--before--BorderColor --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label	--pf-c-label--m-blue__content--link--focus--before--BorderColor	#06c
--pf-c-label--m-blue__content--link--focus--before--BorderColor --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label	--pf-c-label--m-outline--m-blue__content--Color	#06c
--pf-c-label--m-outline--m-blue__content--Color --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label	--pf-c-label--m-outline--m-blue__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-blue__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-green--BackgroundColor	#f3faf2
--pf-c-label--m-green--BackgroundColor --pf-global--palette--green-50 $pf-color-green-50 #f3faf2
	.pf-c-label	--pf-c-label--m-green__icon--Color	#3e8635
--pf-c-label--m-green__icon--Color --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label	--pf-c-label--m-green__content--Color	#1e4f18
--pf-c-label--m-green__content--Color --pf-global--success-color--200 $pf-global--success-color--200 $pf-color-green-600 #1e4f18
	.pf-c-label	--pf-c-label--m-green__content--before--BorderColor	#bde5b8
--pf-c-label--m-green__content--before--BorderColor --pf-global--palette--green-100 $pf-color-green-100 #bde5b8
	.pf-c-label	--pf-c-label--m-green__content--link--hover--before--BorderColor	#3e8635
--pf-c-label--m-green__content--link--hover--before--BorderColor --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label	--pf-c-label--m-green__content--link--focus--before--BorderColor	#3e8635
--pf-c-label--m-green__content--link--focus--before--BorderColor --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label	--pf-c-label--m-outline--m-green__content--Color	#3e8635
--pf-c-label--m-outline--m-green__content--Color --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label	--pf-c-label--m-outline--m-green__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-green__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-orange--BackgroundColor	#fdf7e7
--pf-c-label--m-orange--BackgroundColor --pf-global--palette--gold-50 $pf-color-gold-50 #fdf7e7
	.pf-c-label	--pf-c-label--m-orange__icon--Color	#ec7a08
--pf-c-label--m-orange__icon--Color --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label	--pf-c-label--m-orange__content--Color	#3d2c00
--pf-c-label--m-orange__content--Color --pf-global--palette--gold-700 $pf-color-gold-700 #3d2c00
	.pf-c-label	--pf-c-label--m-orange__content--before--BorderColor	#f4b678
--pf-c-label--m-orange__content--before--BorderColor --pf-global--palette--orange-100 $pf-color-orange-100 #f4b678
	.pf-c-label	--pf-c-label--m-orange__content--link--hover--before--BorderColor	#ec7a08
--pf-c-label--m-orange__content--link--hover--before--BorderColor --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label	--pf-c-label--m-orange__content--link--focus--before--BorderColor	#ec7a08
--pf-c-label--m-orange__content--link--focus--before--BorderColor --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label	--pf-c-label--m-outline--m-orange__content--Color	#8f4700
--pf-c-label--m-outline--m-orange__content--Color --pf-global--palette--orange-500 $pf-color-orange-500 #8f4700
	.pf-c-label	--pf-c-label--m-outline--m-orange__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-orange__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-red--BackgroundColor	#faeae8
--pf-c-label--m-red--BackgroundColor --pf-global--palette--red-50 $pf-color-red-50 #faeae8
	.pf-c-label	--pf-c-label--m-red__icon--Color	#c9190b
--pf-c-label--m-red__icon--Color --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label	--pf-c-label--m-red__content--Color	#7d1007
--pf-c-label--m-red__content--Color --pf-global--palette--red-300 $pf-color-red-300 #7d1007
	.pf-c-label	--pf-c-label--m-red__content--before--BorderColor	#c9190b
--pf-c-label--m-red__content--before--BorderColor --pf-global--palette--red-100 $pf-color-red-100 #c9190b
	.pf-c-label	--pf-c-label--m-red__content--link--hover--before--BorderColor	#c9190b
--pf-c-label--m-red__content--link--hover--before--BorderColor --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label	--pf-c-label--m-red__content--link--focus--before--BorderColor	#c9190b
--pf-c-label--m-red__content--link--focus--before--BorderColor --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label	--pf-c-label--m-outline--m-red__content--Color	#c9190b
--pf-c-label--m-outline--m-red__content--Color --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label	--pf-c-label--m-outline--m-red__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-red__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-purple--BackgroundColor	#f2f0fc
--pf-c-label--m-purple--BackgroundColor --pf-global--palette--purple-50 $pf-color-purple-50 #f2f0fc
	.pf-c-label	--pf-c-label--m-purple__icon--Color	#6753ac
--pf-c-label--m-purple__icon--Color --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label	--pf-c-label--m-purple__content--Color	#1f0066
--pf-c-label--m-purple__content--Color --pf-global--palette--purple-700 $pf-color-purple-700 #1f0066
	.pf-c-label	--pf-c-label--m-purple__content--before--BorderColor	#cbc1ff
--pf-c-label--m-purple__content--before--BorderColor --pf-global--palette--purple-100 $pf-color-purple-100 #cbc1ff
	.pf-c-label	--pf-c-label--m-purple__content--link--hover--before--BorderColor	#6753ac
--pf-c-label--m-purple__content--link--hover--before--BorderColor --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label	--pf-c-label--m-purple__content--link--focus--before--BorderColor	#6753ac
--pf-c-label--m-purple__content--link--focus--before--BorderColor --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label	--pf-c-label--m-outline--m-purple__content--Color	#6753ac
--pf-c-label--m-outline--m-purple__content--Color --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label	--pf-c-label--m-outline--m-purple__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-purple__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-cyan--BackgroundColor	#f2f9f9
--pf-c-label--m-cyan--BackgroundColor --pf-global--palette--cyan-50 $pf-color-cyan-50 #f2f9f9
	.pf-c-label	--pf-c-label--m-cyan__icon--Color	#009596
--pf-c-label--m-cyan__icon--Color --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label	--pf-c-label--m-cyan__content--Color	#003737
--pf-c-label--m-cyan__content--Color --pf-global--default-color--300 $pf-global--default-color--300 $pf-color-cyan-500 #003737
	.pf-c-label	--pf-c-label--m-cyan__content--before--BorderColor	#a2d9d9
--pf-c-label--m-cyan__content--before--BorderColor --pf-global--palette--cyan-100 $pf-color-cyan-100 #a2d9d9
	.pf-c-label	--pf-c-label--m-cyan__content--link--hover--before--BorderColor	#009596
--pf-c-label--m-cyan__content--link--hover--before--BorderColor --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label	--pf-c-label--m-cyan__content--link--focus--before--BorderColor	#009596
--pf-c-label--m-cyan__content--link--focus--before--BorderColor --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label	--pf-c-label--m-outline--m-cyan__content--Color	#005f60
--pf-c-label--m-outline--m-cyan__content--Color --pf-global--palette--cyan-400 $pf-color-cyan-400 #005f60
	.pf-c-label	--pf-c-label--m-outline--m-cyan__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-cyan__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label	--pf-c-label--m-overflow__content--Color	#06c
--pf-c-label--m-overflow__content--Color --pf-global--link--Color $pf-global--link--Color $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label	--pf-c-label--m-overflow__content--BackgroundColor	#fff
--pf-c-label--m-overflow__content--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-label	--pf-c-label--m-overflow__content--before--BorderWidth	1px
--pf-c-label--m-overflow__content--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-label	--pf-c-label--m-overflow__content--before--BorderColor	#f0f0f0
--pf-c-label--m-overflow__content--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-label	--pf-c-label--m-overflow__content--link--hover--before--BorderWidth	2px
--pf-c-label--m-overflow__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label--m-overflow__content--link--hover--before--BorderColor	#f0f0f0
--pf-c-label--m-overflow__content--link--hover--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-label	--pf-c-label--m-overflow__content--link--focus--before--BorderWidth	2px
--pf-c-label--m-overflow__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label	--pf-c-label--m-overflow__content--link--focus--before--BorderColor	#f0f0f0
--pf-c-label--m-overflow__content--link--focus--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-label	--pf-c-label__content--Color	#151515
--pf-c-label__content--Color --pf-global--Color--100 $pf-global--Color--100 $pf-color-black-900 #151515
	.pf-c-label	--pf-c-label--m-outline__content--Color	#151515
--pf-c-label--m-outline__content--Color --pf-global--Color--100 $pf-global--Color--100 $pf-color-black-900 #151515
	.pf-c-label	--pf-c-label__text--MaxWidth	16ch
	.pf-c-label	--pf-c-label__icon--Color	#151515
--pf-c-label__icon--Color --pf-global--Color--100 $pf-global--Color--100 $pf-color-black-900 #151515
	.pf-c-label	--pf-c-label__icon--MarginRight	0.25rem
--pf-c-label__icon--MarginRight --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label__c-button--FontSize	0.75rem
--pf-c-label__c-button--FontSize --pf-global--FontSize--xs $pf-global--FontSize--xs pf-font-prem(12px) 0.75rem
	.pf-c-label	--pf-c-label__c-button--MarginTop	calc(0.375rem * -1)
--pf-c-label__c-button--MarginTop calc(--pf-global--spacer--form-element * -1) calc($pf-global--spacer--form-element * -1) calc(pf-size-prem(6px) * -1) calc(0.375rem * -1)
	.pf-c-label	--pf-c-label__c-button--MarginRight	calc(0.375rem * -1)
--pf-c-label__c-button--MarginRight calc(--pf-global--spacer--form-element * -1) calc($pf-global--spacer--form-element * -1) calc(pf-size-prem(6px) * -1) calc(0.375rem * -1)
	.pf-c-label	--pf-c-label__c-button--MarginBottom	calc(0.375rem * -1)
--pf-c-label__c-button--MarginBottom calc(--pf-global--spacer--form-element * -1) calc($pf-global--spacer--form-element * -1) calc(pf-size-prem(6px) * -1) calc(0.375rem * -1)
	.pf-c-label	--pf-c-label__c-button--MarginLeft	0.25rem
--pf-c-label__c-button--MarginLeft --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label__c-button--PaddingTop	0.25rem
--pf-c-label__c-button--PaddingTop --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label__c-button--PaddingRight	0.5rem
--pf-c-label__c-button--PaddingRight --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label	--pf-c-label__c-button--PaddingBottom	0.25rem
--pf-c-label__c-button--PaddingBottom --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label	--pf-c-label__c-button--PaddingLeft	0.5rem
--pf-c-label__c-button--PaddingLeft --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label.pf-m-blue	--pf-c-label--BackgroundColor	#e7f1fa
--pf-c-label--BackgroundColor --pf-c-label--m-blue--BackgroundColor --pf-global--palette--blue-50 $pf-color-blue-50 #e7f1fa
	.pf-c-label.pf-m-blue	--pf-c-label__icon--Color	#06c
--pf-c-label__icon--Color --pf-c-label--m-blue__icon--Color --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label.pf-m-blue	--pf-c-label__content--Color	#002952
--pf-c-label__content--Color --pf-c-label--m-blue__content--Color --pf-global--info-color--200 $pf-global--info-color--200 $pf-color-blue-600 #002952
	.pf-c-label.pf-m-blue	--pf-c-label__content--before--BorderColor	#bee1f4
--pf-c-label__content--before--BorderColor --pf-c-label--m-blue__content--before--BorderColor --pf-global--palette--blue-100 $pf-color-blue-100 #bee1f4
	.pf-c-label.pf-m-blue	--pf-c-label__content--link--hover--before--BorderColor	#06c
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-blue__content--link--hover--before--BorderColor --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label.pf-m-blue	--pf-c-label__content--link--focus--before--BorderColor	#06c
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-blue__content--link--focus--before--BorderColor --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label.pf-m-blue	--pf-c-label--m-outline__content--Color	#06c
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-blue__content--Color --pf-global--primary-color--100 $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label.pf-m-blue	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-blue__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-blue	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-blue	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-green	--pf-c-label--BackgroundColor	#f3faf2
--pf-c-label--BackgroundColor --pf-c-label--m-green--BackgroundColor --pf-global--palette--green-50 $pf-color-green-50 #f3faf2
	.pf-c-label.pf-m-green	--pf-c-label__icon--Color	#3e8635
--pf-c-label__icon--Color --pf-c-label--m-green__icon--Color --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label.pf-m-green	--pf-c-label__content--Color	#1e4f18
--pf-c-label__content--Color --pf-c-label--m-green__content--Color --pf-global--success-color--200 $pf-global--success-color--200 $pf-color-green-600 #1e4f18
	.pf-c-label.pf-m-green	--pf-c-label__content--before--BorderColor	#bde5b8
--pf-c-label__content--before--BorderColor --pf-c-label--m-green__content--before--BorderColor --pf-global--palette--green-100 $pf-color-green-100 #bde5b8
	.pf-c-label.pf-m-green	--pf-c-label__content--link--hover--before--BorderColor	#3e8635
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-green__content--link--hover--before--BorderColor --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label.pf-m-green	--pf-c-label__content--link--focus--before--BorderColor	#3e8635
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-green__content--link--focus--before--BorderColor --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label.pf-m-green	--pf-c-label--m-outline__content--Color	#3e8635
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-green__content--Color --pf-global--success-color--100 $pf-global--success-color--100 $pf-color-green-500 #3e8635
	.pf-c-label.pf-m-green	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-green__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-green	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-green	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-orange	--pf-c-label--BackgroundColor	#fdf7e7
--pf-c-label--BackgroundColor --pf-c-label--m-orange--BackgroundColor --pf-global--palette--gold-50 $pf-color-gold-50 #fdf7e7
	.pf-c-label.pf-m-orange	--pf-c-label__icon--Color	#ec7a08
--pf-c-label__icon--Color --pf-c-label--m-orange__icon--Color --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label.pf-m-orange	--pf-c-label__content--Color	#3d2c00
--pf-c-label__content--Color --pf-c-label--m-orange__content--Color --pf-global--palette--gold-700 $pf-color-gold-700 #3d2c00
	.pf-c-label.pf-m-orange	--pf-c-label__content--before--BorderColor	#f4b678
--pf-c-label__content--before--BorderColor --pf-c-label--m-orange__content--before--BorderColor --pf-global--palette--orange-100 $pf-color-orange-100 #f4b678
	.pf-c-label.pf-m-orange	--pf-c-label__content--link--hover--before--BorderColor	#ec7a08
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-orange__content--link--hover--before--BorderColor --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label.pf-m-orange	--pf-c-label__content--link--focus--before--BorderColor	#ec7a08
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-orange__content--link--focus--before--BorderColor --pf-global--palette--orange-300 $pf-color-orange-300 #ec7a08
	.pf-c-label.pf-m-orange	--pf-c-label--m-outline__content--Color	#8f4700
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-orange__content--Color --pf-global--palette--orange-500 $pf-color-orange-500 #8f4700
	.pf-c-label.pf-m-orange	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-orange__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-orange	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-orange	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-red	--pf-c-label--BackgroundColor	#faeae8
--pf-c-label--BackgroundColor --pf-c-label--m-red--BackgroundColor --pf-global--palette--red-50 $pf-color-red-50 #faeae8
	.pf-c-label.pf-m-red	--pf-c-label__icon--Color	#c9190b
--pf-c-label__icon--Color --pf-c-label--m-red__icon--Color --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label.pf-m-red	--pf-c-label__content--Color	#7d1007
--pf-c-label__content--Color --pf-c-label--m-red__content--Color --pf-global--palette--red-300 $pf-color-red-300 #7d1007
	.pf-c-label.pf-m-red	--pf-c-label__content--before--BorderColor	#c9190b
--pf-c-label__content--before--BorderColor --pf-c-label--m-red__content--before--BorderColor --pf-global--palette--red-100 $pf-color-red-100 #c9190b
	.pf-c-label.pf-m-red	--pf-c-label__content--link--hover--before--BorderColor	#c9190b
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-red__content--link--hover--before--BorderColor --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label.pf-m-red	--pf-c-label__content--link--focus--before--BorderColor	#c9190b
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-red__content--link--focus--before--BorderColor --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label.pf-m-red	--pf-c-label--m-outline__content--Color	#c9190b
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-red__content--Color --pf-global--danger-color--100 $pf-global--danger-color--100 $pf-color-red-100 #c9190b
	.pf-c-label.pf-m-red	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-red__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-red	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-red	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-purple	--pf-c-label--BackgroundColor	#f2f0fc
--pf-c-label--BackgroundColor --pf-c-label--m-purple--BackgroundColor --pf-global--palette--purple-50 $pf-color-purple-50 #f2f0fc
	.pf-c-label.pf-m-purple	--pf-c-label__icon--Color	#6753ac
--pf-c-label__icon--Color --pf-c-label--m-purple__icon--Color --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label.pf-m-purple	--pf-c-label__content--Color	#1f0066
--pf-c-label__content--Color --pf-c-label--m-purple__content--Color --pf-global--palette--purple-700 $pf-color-purple-700 #1f0066
	.pf-c-label.pf-m-purple	--pf-c-label__content--before--BorderColor	#cbc1ff
--pf-c-label__content--before--BorderColor --pf-c-label--m-purple__content--before--BorderColor --pf-global--palette--purple-100 $pf-color-purple-100 #cbc1ff
	.pf-c-label.pf-m-purple	--pf-c-label__content--link--hover--before--BorderColor	#6753ac
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-purple__content--link--hover--before--BorderColor --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label.pf-m-purple	--pf-c-label__content--link--focus--before--BorderColor	#6753ac
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-purple__content--link--focus--before--BorderColor --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label.pf-m-purple	--pf-c-label--m-outline__content--Color	#6753ac
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-purple__content--Color --pf-global--palette--purple-500 $pf-color-purple-500 #6753ac
	.pf-c-label.pf-m-purple	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-purple__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-purple	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-purple	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-cyan	--pf-c-label--BackgroundColor	#f2f9f9
--pf-c-label--BackgroundColor --pf-c-label--m-cyan--BackgroundColor --pf-global--palette--cyan-50 $pf-color-cyan-50 #f2f9f9
	.pf-c-label.pf-m-cyan	--pf-c-label__icon--Color	#009596
--pf-c-label__icon--Color --pf-c-label--m-cyan__icon--Color --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label.pf-m-cyan	--pf-c-label__content--Color	#003737
--pf-c-label__content--Color --pf-c-label--m-cyan__content--Color --pf-global--default-color--300 $pf-global--default-color--300 $pf-color-cyan-500 #003737
	.pf-c-label.pf-m-cyan	--pf-c-label__content--before--BorderColor	#a2d9d9
--pf-c-label__content--before--BorderColor --pf-c-label--m-cyan__content--before--BorderColor --pf-global--palette--cyan-100 $pf-color-cyan-100 #a2d9d9
	.pf-c-label.pf-m-cyan	--pf-c-label__content--link--hover--before--BorderColor	#009596
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-cyan__content--link--hover--before--BorderColor --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label.pf-m-cyan	--pf-c-label__content--link--focus--before--BorderColor	#009596
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-cyan__content--link--focus--before--BorderColor --pf-global--default-color--200 $pf-global--default-color--200 $pf-color-cyan-300 #009596
	.pf-c-label.pf-m-cyan	--pf-c-label--m-outline__content--Color	#005f60
--pf-c-label--m-outline__content--Color --pf-c-label--m-outline--m-cyan__content--Color --pf-global--palette--cyan-400 $pf-color-cyan-400 #005f60
	.pf-c-label.pf-m-cyan	--pf-c-label--m-outline__content--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--before--BorderColor --pf-c-label--m-outline--m-cyan__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-cyan	--pf-c-label--m-outline__content--link--hover--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-cyan	--pf-c-label--m-outline__content--link--focus--before--BorderColor	#d2d2d2
--pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-outline	--pf-c-label__content--Color	#151515
--pf-c-label__content--Color --pf-c-label--m-outline__content--Color --pf-global--Color--100 $pf-global--Color--100 $pf-color-black-900 #151515
	.pf-c-label.pf-m-outline	--pf-c-label__content--before--BorderWidth	1px
--pf-c-label__content--before--BorderWidth --pf-c-label--m-outline__content--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-label.pf-m-outline	--pf-c-label__content--before--BorderColor	#d2d2d2
--pf-c-label__content--before--BorderColor --pf-c-label--m-outline__content--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-outline	--pf-c-label--BackgroundColor	#fff
--pf-c-label--BackgroundColor --pf-c-label--m-outline--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-label.pf-m-overflow:hover	--pf-c-label__content--before--BorderWidth	2px
--pf-c-label__content--before--BorderWidth --pf-c-label--m-outline__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label.pf-m-overflow:hover	--pf-c-label__content--before--BorderColor	#d2d2d2
--pf-c-label__content--before--BorderColor --pf-c-label--m-outline__content--link--hover--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label.pf-m-overflow:focus	--pf-c-label__content--before--BorderWidth	2px
--pf-c-label__content--before--BorderWidth --pf-c-label--m-outline__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label.pf-m-overflow:focus	--pf-c-label__content--before--BorderColor	#d2d2d2
--pf-c-label__content--before--BorderColor --pf-c-label--m-outline__content--link--focus--before--BorderColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-label .pf-c-button	--pf-c-button--FontSize	0.75rem
--pf-c-button--FontSize --pf-c-label__c-button--FontSize --pf-global--FontSize--xs $pf-global--FontSize--xs pf-font-prem(12px) 0.75rem
	.pf-c-label .pf-c-button	--pf-c-button--PaddingTop	0.25rem
--pf-c-button--PaddingTop --pf-c-label__c-button--PaddingTop --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label .pf-c-button	--pf-c-button--PaddingRight	0.5rem
--pf-c-button--PaddingRight --pf-c-label__c-button--PaddingRight --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label .pf-c-button	--pf-c-button--PaddingBottom	0.25rem
--pf-c-button--PaddingBottom --pf-c-label__c-button--PaddingBottom --pf-global--spacer--xs $pf-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-c-label .pf-c-button	--pf-c-button--PaddingLeft	0.5rem
--pf-c-button--PaddingLeft --pf-c-label__c-button--PaddingLeft --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-label.pf-m-overflow	--pf-c-label__content--Color	#06c
--pf-c-label__content--Color --pf-c-label--m-overflow__content--Color --pf-global--link--Color $pf-global--link--Color $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-label.pf-m-overflow	--pf-c-label--BackgroundColor	#fff
--pf-c-label--BackgroundColor --pf-c-label--m-overflow__content--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-label.pf-m-overflow	--pf-c-label__content--before--BorderWidth	1px
--pf-c-label__content--before--BorderWidth --pf-c-label--m-overflow__content--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-label.pf-m-overflow	--pf-c-label__content--before--BorderColor	#f0f0f0
--pf-c-label__content--before--BorderColor --pf-c-label--m-overflow__content--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-label.pf-m-overflow	--pf-c-label__content--link--hover--before--BorderWidth	2px
--pf-c-label__content--link--hover--before--BorderWidth --pf-c-label--m-overflow__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label.pf-m-overflow	--pf-c-label__content--link--hover--before--BorderColor	#f0f0f0
--pf-c-label__content--link--hover--before--BorderColor --pf-c-label--m-overflow__content--link--hover--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-label.pf-m-overflow	--pf-c-label__content--link--focus--before--BorderWidth	2px
--pf-c-label__content--link--focus--before--BorderWidth --pf-c-label--m-overflow__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	.pf-c-label.pf-m-overflow	--pf-c-label__content--link--focus--before--BorderColor	#f0f0f0
--pf-c-label__content--link--focus--before--BorderColor --pf-c-label--m-overflow__content--link--focus--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	a.pf-c-label__content:hover	--pf-c-label__content--before--BorderWidth	2px
--pf-c-label__content--before--BorderWidth --pf-c-label__content--link--hover--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	a.pf-c-label__content:hover	--pf-c-label__content--before--BorderColor	#8a8d90
--pf-c-label__content--before--BorderColor --pf-c-label__content--link--hover--before--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 $pf-color-black-500 #8a8d90
	a.pf-c-label__content:focus	--pf-c-label__content--before--BorderWidth	2px
--pf-c-label__content--before--BorderWidth --pf-c-label__content--link--focus--before--BorderWidth --pf-global--BorderWidth--md $pf-global--BorderWidth--md 2px
	a.pf-c-label__content:focus	--pf-c-label__content--before--BorderColor	#8a8d90
--pf-c-label__content--before--BorderColor --pf-c-label__content--link--focus--before--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 $pf-color-black-500 #8a8d90

View source on GitHub

QUICKLINKS

CONTRIBUTE

STAY IN TOUCH

Privacy statement Terms of use All policies and guidelines