diff --git a/ui/src/components/frame/IconRail.tsx b/ui/src/components/frame/IconRail.tsx
index 9eaf15cc..7c83dfc1 100644
--- a/ui/src/components/frame/IconRail.tsx
+++ b/ui/src/components/frame/IconRail.tsx
@@ -90,7 +90,7 @@ export function IconRail({ companyPrefix }: IconRailProps) {
       <Link
         to={companyPrefix ? `/${companyPrefix}/assistant` : "/"}
         aria-label="Nexus home"
-        className="mb-4 flex h-8 w-8 items-center justify-center rounded-[4px] text-[#faff69]"
+        className="mb-4 flex h-8 w-8 items-center justify-center rounded-[4px] text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background"
       >
         <NexusMark className="h-5 w-5" />
       </Link>
@@ -140,7 +140,8 @@ function DestinationLink({
         className={cn(
           "flex h-10 w-10 items-center justify-center rounded-[4px]",
           "transition-colors duration-100 ease-out",
-          active ? "text-[#faff69]" : "text-muted-foreground hover:text-[#faff69]",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+          active ? "text-primary" : "text-muted-foreground hover:text-primary",
         )}
       >
         <Icon className="h-5 w-5" strokeWidth={1.5} />
@@ -149,7 +150,7 @@ function DestinationLink({
       {active && (
         <span
           aria-hidden="true"
-          className="absolute right-0 top-1/2 h-5 w-[2px] -translate-y-1/2 bg-[#faff69]"
+          className="absolute right-0 top-1/2 h-5 w-[2px] -translate-y-1/2 bg-primary"
         />
       )}
     </li>