diff --git a/.changeset/hook-trace-bar-gray.md b/.changeset/hook-trace-bar-gray.md
new file mode 100644
index 0000000000..96f6782f94
--- /dev/null
+++ b/.changeset/hook-trace-bar-gray.md
@@ -0,0 +1,5 @@
+---
+'@workflow/web-shared': patch
+---
+
+Use gray instead of amber for hook bars in the trace viewer.
diff --git a/packages/web-shared/src/components/new-trace-viewer/utils.test.ts b/packages/web-shared/src/components/new-trace-viewer/utils.test.ts
index a6cf0d212c..3a049d41af 100644
--- a/packages/web-shared/src/components/new-trace-viewer/utils.test.ts
+++ b/packages/web-shared/src/components/new-trace-viewer/utils.test.ts
@@ -6,6 +6,7 @@ import {
   computeSpanMarkers,
   computeSpanSegments,
   computeTimeMarkers,
+  getResourceColor,
 } from './utils';
 
 /** Build a high-res timestamp tuple ([seconds, nanoseconds]) for a given ms. */
@@ -245,3 +246,14 @@ describe('computeTimeMarkers', () => {
     ]);
   });
 });
+
+describe('getResourceColor', () => {
+  it('uses gray for hooks (passive spans), not amber', () => {
+    expect(getResourceColor('hook')).toEqual({
+      bg: 'var(--ds-gray-200)',
+      border: 'var(--ds-gray-500)',
+      errorBg: 'var(--ds-red-200)',
+      errorBorder: 'var(--ds-red-500)',
+    });
+  });
+});
diff --git a/packages/web-shared/src/components/new-trace-viewer/utils.ts b/packages/web-shared/src/components/new-trace-viewer/utils.ts
index affa7d5eb9..50f8efbe85 100644
--- a/packages/web-shared/src/components/new-trace-viewer/utils.ts
+++ b/packages/web-shared/src/components/new-trace-viewer/utils.ts
@@ -223,9 +223,10 @@ export const RESOURCE_COLORS: Record<
     errorBg: 'var(--ds-red-200)',
     errorBorder: 'var(--ds-red-500)',
   },
+  // Passive spans (hooks) stay gray — matches event-list icons and the minimap.
   hook: {
-    bg: 'var(--ds-amber-200)',
-    border: 'var(--ds-amber-500)',
+    bg: 'var(--ds-gray-200)',
+    border: 'var(--ds-gray-500)',
     errorBg: 'var(--ds-red-200)',
     errorBorder: 'var(--ds-red-500)',
   },