diff --git a/apps/client/src/widgets/layout/Breadcrumb.css b/apps/client/src/widgets/layout/Breadcrumb.css
index c4de82685..fb6ef5842 100644
--- a/apps/client/src/widgets/layout/Breadcrumb.css
+++ b/apps/client/src/widgets/layout/Breadcrumb.css
@@ -63,7 +63,7 @@
     a.breadcrumb-last-item,
     a.breadcrumb-last-item:visited {
         text-decoration: none;
-        color: currentColor;
+        color: var(--custom-color, currentColor);
         font-weight: 600;
     }
 
diff --git a/apps/client/src/widgets/layout/Breadcrumb.tsx b/apps/client/src/widgets/layout/Breadcrumb.tsx
index 780ae0d4b..72ad55988 100644
--- a/apps/client/src/widgets/layout/Breadcrumb.tsx
+++ b/apps/client/src/widgets/layout/Breadcrumb.tsx
@@ -1,5 +1,6 @@
 import "./Breadcrumb.css";
 
+import clsx from "clsx";
 import { useContext, useRef, useState } from "preact/hooks";
 import { Fragment } from "preact/jsx-runtime";
 
@@ -23,7 +24,7 @@ import ActionButton from "../react/ActionButton";
 import { Badge } from "../react/Badge";
 import Dropdown from "../react/Dropdown";
 import { FormListItem } from "../react/FormList";
-import { useActiveNoteContext, useChildNotes, useNote, useNoteIcon, useNoteLabel, useNoteLabelBoolean, useNoteProperty, useStaticTooltip } from "../react/hooks";
+import { useActiveNoteContext, useChildNotes, useNote, useNoteColorClass, useNoteIcon, useNoteLabel, useNoteLabelBoolean, useNoteProperty, useStaticTooltip } from "../react/hooks";
 import Icon from "../react/Icon";
 import { NewNoteLink } from "../react/NoteLink";
 import { ParentComponent } from "../react/react_utils";
@@ -128,6 +129,7 @@ function BreadcrumbLastItem({ notePath, parentComponent }: { notePath: string, p
     const noteId = notePath.split("/").at(-1);
     const [ note ] = useState(() => froca.getNoteFromCache(noteId!));
     const title = useNoteProperty(note, "title");
+    const colorClass = useNoteColorClass(note);
     useStaticTooltip(linkRef, {
         placement: "top",
         title: t("breadcrumb.scroll_to_top_title")
@@ -139,7 +141,7 @@ function BreadcrumbLastItem({ notePath, parentComponent }: { notePath: string, p
         <a
             ref={linkRef}
             href="#"
-            className="breadcrumb-last-item tn-link"
+            className={clsx("breadcrumb-last-item tn-link", colorClass)}
             onClick={() => {
                 const activeNtxId = appContext.tabManager.activeNtxId;
                 const scrollingContainer = document.querySelector(`[data-ntx-id="${activeNtxId}"] .scrolling-container`);