diff --git a/frontend/src/renderer/components/Breadcrumb.jsx b/frontend/src/renderer/components/Breadcrumb.jsx
new file mode 100644
index 0000000..9e4f2e4
--- /dev/null
+++ b/frontend/src/renderer/components/Breadcrumb.jsx
@@ -0,0 +1,37 @@
+import React from 'react';
+import { Breadcrumb as AntBreadcrumb } from 'antd';
+import { HomeOutlined, FolderOutlined } from '@ant-design/icons';
+
+function Breadcrumb({ path, onNavigate }) {
+  const items = [
+    { 
+      title: <HomeOutlined />, 
+      href: '#',
+      onClick: (e) => {
+        e.preventDefault();
+        onNavigate?.(null);
+      }
+    },
+    ...path.map((item, index) => ({
+      title: (
+        <span 
+          onClick={(e) => {
+            e.preventDefault();
+            onNavigate?.(item.id);
+          }}
+        >
+          <FolderOutlined /> {item.name}
+        </span>
+      )
+    }))
+  ];
+
+  return (
+    <AntBreadcrumb 
+      items={items} 
+      style={{ margin: '16px 0' }}
+    />
+  );
+}
+
+export default Breadcrumb;