diff --git a/src/components/CopyableId.svelte b/src/components/CopyableId.svelte
index 1b9b5e119..1c598fbdd 100644
--- a/src/components/CopyableId.svelte
+++ b/src/components/CopyableId.svelte
@@ -11,13 +11,16 @@
 <style>
   .id {
     cursor: pointer;
-    color: var(--color-fill-secondary);
+    color: var(--color-foreground-emphasized);
     overflow-wrap: anywhere;
     display: flex;
     align-items: center;
     gap: 0.125rem;
     width: fit-content;
   }
+  .id:hover {
+    color: var(--color-foreground-emphasized-hover);
+  }
 </style>
 
 <!-- svelte-ignore a11y-click-events-have-key-events -->
@@ -31,7 +34,8 @@
   <span
     class="txt-overflow"
     class:global-commit={style === "commit"}
-    class:global-oid={style === "oid"}>
+    class:global-oid={style === "oid"}
+    style="color: inherit">
     <slot>{id}</slot>
   </span>
   <Clipboard bind:this={clipboard} text={id} />