Implement forced colors for progress bar (#3686)

langermank · web-flow · commit db729fb7e115 · 2025-09-19T01:35:37.000Z
diff --git a/.changeset/wet-pugs-divide.md b/.changeset/wet-pugs-divide.md
@@ -0,0 +1,5 @@
+---
+"@primer/view-components": patch
+---
+
+Implement forced colors for progress bar
diff --git a/app/components/primer/beta/progress_bar.pcss b/app/components/primer/beta/progress_bar.pcss
@@ -20,8 +20,19 @@
 
 .Progress-item {
   outline: 2px solid transparent; /* Support Firefox custom colors */
+  background: LinkText;
 }
 
 .Progress-item + .Progress-item {
   margin-left: var(--base-size-2);
 }
+
+@media (forced-colors: active) {
+  :root {
+    --progressBar-track-bgColor: CanvasText;
+  }
+
+  .Progress, .Progress-item {
+    forced-color-adjust: none;
+  }
+}

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@primer/view-components": patch
 +---
++
 +Implement forced colors for progress bar