diff --git a/src/App.tsx b/src/App.tsx
index 13068d4..9599322 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,10 +1,12 @@
 import { SongCard } from "./components/SongCard";
 import { songs } from "./data/songs"
+import { Navigation } from "./components/Navigation";
 
 function App() {
   return (
     <main>
       <SongCard song={songs[0]} />
+      <Navigation isFirst={true} isLast={false} />
     </main>
   )
 }
diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx
new file mode 100644
index 0000000..e5d001b
--- /dev/null
+++ b/src/components/Navigation.tsx
@@ -0,0 +1,26 @@
+type NavigationProps = {
+  isFirst: boolean
+  isLast: boolean
+}
+
+export function Navigation({isFirst, isLast}: NavigationProps) {
+  return (
+    <nav aria-label="Navigering mellom sanger">
+      <button
+        type="button"
+        aria-label="Forrige sang"
+        disabled={isFirst}  
+      >
+        ← Forrige
+      </button>
+
+      <button
+        type="button"
+        aria-label="Neste sang"
+        disabled={isLast}
+      >
+        Neste →
+      </button>
+    </nav>
+  )
+}
\ No newline at end of file