diff --git a/package-lock.json b/package-lock.json
index 26cd1a3..c64d9e0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "salam",
       "version": "0.0.0",
       "dependencies": {
+        "nprogress": "^0.2.0",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-router-dom": "^7.0.2"
@@ -3960,6 +3961,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/nprogress": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/nprogress/-/nprogress-0.2.0.tgz",
+      "integrity": "sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==",
+      "license": "MIT"
+    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
diff --git a/package.json b/package.json
index a11c931..da17310 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "nprogress": "^0.2.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^7.0.2"
diff --git a/src/components/editor/Editor.jsx b/src/components/editor/Editor.jsx
index f828326..6d1411e 100644
--- a/src/components/editor/Editor.jsx
+++ b/src/components/editor/Editor.jsx
@@ -2,7 +2,7 @@ const Editor = () => {
 
     return (<>
         <main className={"w-[calc(100%-50px)] h-[calc(100vh-35px)] bg-[#FFF1E9] rounded-tr-[15px] after:inline-block after:border-0 after:z-[-1] after:w-[30px] after:h-[30px] after:bg-[#ffdecc] after:absolute relative after:top-0 after:right-0"}>
-
+            
         </main>
     </>)
 }
diff --git a/src/components/editor/Logo.jsx b/src/components/editor/Logo.jsx
new file mode 100644
index 0000000..44294e1
--- /dev/null
+++ b/src/components/editor/Logo.jsx
@@ -0,0 +1,12 @@
+import {Link} from "react-router-dom";
+
+const Logo = () => {
+
+    return (<>
+        <Link to={"/"}>
+            <img src="/images/favicon.svg" alt="salam logo" className={"w-[40px] absolute top-[5px] right-[7px]"}/>
+        </Link>
+    </>)
+}
+
+export default Logo;
\ No newline at end of file
diff --git a/src/components/nprogress/RouteChangeHandler.jsx b/src/components/nprogress/RouteChangeHandler.jsx
new file mode 100644
index 0000000..d4509a1
--- /dev/null
+++ b/src/components/nprogress/RouteChangeHandler.jsx
@@ -0,0 +1,22 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+import NProgress from 'nprogress';
+import 'nprogress/nprogress.css';
+
+const RouteChangeHandler = () => {
+    const location = useLocation();
+
+    useEffect(() => {
+        NProgress.start();
+
+        const timer = setTimeout(() => {
+            NProgress.done();
+        }, 300);
+
+        return () => clearTimeout(timer);
+    }, [location]);
+
+    return null;
+};
+
+export default RouteChangeHandler;
diff --git a/src/layouts/EditorLayout.jsx b/src/layouts/EditorLayout.jsx
index 5fa3a19..a242e8f 100644
--- a/src/layouts/EditorLayout.jsx
+++ b/src/layouts/EditorLayout.jsx
@@ -1,11 +1,13 @@
 import Header from "../components/header/Header.jsx";
 import Side from "../components/sidebar/Side.jsx";
 import Editor from "../components/editor/Editor.jsx";
+import Logo from "../components/editor/Logo.jsx";
 
 const EditorLayout = () => {
 
     return (<>
         <Header />
+        <Logo />
         <Side />
         <Editor />
     </>)
diff --git a/src/main.jsx b/src/main.jsx
index c8e9f0e..7beb5da 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -1,9 +1,11 @@
 import { createRoot } from 'react-dom/client'
 import {BrowserRouter, Route, Routes} from "react-router-dom";
 import EditorLayout from "./layouts/EditorLayout.jsx";
+import RouteChangeHandler from "./components/nprogress/RouteChangeHandler.jsx";
 
 createRoot(document.getElementById('root')).render(<>
     <BrowserRouter>
+        <RouteChangeHandler />
         <Routes>
             <Route path="/" element={ <EditorLayout /> } />
         </Routes>
diff --git a/src/styles/style.css b/src/styles/style.css
index 61ec291..ecfec5f 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -3,5 +3,16 @@
 @tailwind utilities;
 
 @layer base {
+    #nprogress .bar {
+        background: #29d;
+    }
 
+    #nprogress .peg {
+        box-shadow: 0 0 10px #29d, 0 0 5px #29d;
+    }
+
+    #nprogress .spinner-icon {
+        border-top-color: #29d;
+        border-left-color: #29d;
+    }
 }
\ No newline at end of file