fix(fuselage-tokens): badge level-1 contrast a11y failing - #2144
Merged
Merged
Conversation
🦋 Changeset detectedLatest commit: 4feeae4 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
juliajforesti
requested changes
Aug 7, 2026
ivans-netto
force-pushed
the
fix/ghost-badge-contrast
branch
from
August 7, 2026 16:14
94552a0 to
11b2385
Compare
This was referenced Aug 7, 2026
juliajforesti
previously requested changes
Aug 7, 2026
ivans-netto
force-pushed
the
fix/ghost-badge-contrast
branch
from
August 10, 2026 13:59
11b2385 to
74db7bb
Compare
…00 value The dark theme's badge level-1 (the secondary badge background) was #484C51, which doesn't match any palette color. It now uses #6C737A — the n700 primitive's value, the same source the light theme references. The literal is intentional: the dark palette doesn't reference primitives. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
ivans-netto
force-pushed
the
fix/ghost-badge-contrast
branch
from
August 11, 2026 12:24
74db7bb to
9c71722
Compare
Resolves the conflict in the badge color tokens: #2148 moved `src/badge/base.json` to `src/colors/badge.json` and added an explicit `"type": "color"` to the dark values, while this branch changed dark `level-1` to the n700 value. Kept the new file layout and format with the n700 (`#6C737A`) value.
juliajforesti
requested changes
Aug 12, 2026
juliajforesti
approved these changes
Aug 12, 2026
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Task
The dark theme's
badge-level-1(thesecondarybadge background) was#484C51, a color that doesn't match anything in the palette. It now uses#6C737A— the value of then700primitive, the same source the light theme references. The literal (rather than a{colors.n700}reference) is intentional: the dark palette doesn't reference primitives.{colors.n700}(unchanged){colors.n800}(unchanged, intentional)White text over #6C737A sits at 4.8:1, above the WCAG AA minimum of 4.5:1 for the badge's micro font size.
Before / After
Storybook
WithValuestory to show every badge variant with its value and a label with the variant name (rebased on top of feat(fuselage)!: Remove theghostvariant and thedisabledprop fromBadge#2147, so it coverssecondary,primary,danger, andwarning).Testing
WithValuegolden regenerated — goldens capture the light theme, which is unchanged by the token fixpatchon@rocket.chat/fuselage-tokens, same message as this PR title)🤖 Generated with Claude Code