diff --git a/showcases/patternhub/pages/foundations/colors/color-usage-guide.tsx b/showcases/patternhub/pages/foundations/colors/color-usage-guide.tsx
index 7cd7bc5b7d9..8edf7f2f2d4 100644
--- a/showcases/patternhub/pages/foundations/colors/color-usage-guide.tsx
+++ b/showcases/patternhub/pages/foundations/colors/color-usage-guide.tsx
@@ -20,7 +20,7 @@ const ColorUsageGuide = () => {
 			</p>
 			<DBSection>
 				<ArcherContainer
-					strokeColor="#c3c7cc"
+					strokeColor="var(--db-current-color-border)"
 					endMarker={true}
 					endShape={{ arrow: { arrowLength: 5, arrowThickness: 5 } }}>
 					<div className="decision-tree" data-density="functional">