patternfly / patternfly/patternfly

Label - update to unified tokens

Open
#8,128 2 comments 1 reaction 1 assignee View on GitHub

@mcoker is already working on this.

Since Feb 24, 2026.

PF Team Stale
Dominant language
SCSS
Stars
817
Forks
116
Avg merge
4d 11h
Merged PRs (30d)
14

Description

Figma Link

https://www.figma.com/design/qRn3S225WwGHIdgGZX0LTC/Unified-Theme--Design-Tokens--Styles---Specs?node-id=9552-14281&p=f&m=dev

Jira/GitHub Ticket Link

TBD

Design Screenshot

image

Any extra notes for developers

@tarunvashishth

Here's what you need to do:

  • Swap out any FA icons in labels to "RH" icons

  • To use "RH" icons, replace any [i class="fas fa..."] HTML with {{{{ pfIcon "rh-icon-name" }}}}

  • the FA "info" icon should change to "rh-ui-information-fill" ({{{{ pfIcon "rh-ui-information-fill" }}}})

  • the FA "times" icon (close button) should change to "rh-microns-close"

  • If there are any more, try to find the closest replacement for the FA icon on here https://pf-react-staging.patternfly.org/icons (search for "rh " to find all of the "rh" icons) and use the most suitable one. Odds are it will be a "rh ui ..." icon

  • Change the spacer/gap between the label text and close button to --pf-t--global--spacer--gap--text-to-element--default (should be 8px)


Jira Issue: PF-3552

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.