diff --git a/LyricsPy/static/style.css b/LyricsPy/static/style.css
index 8fd5894..7257314 100644
--- a/LyricsPy/static/style.css
+++ b/LyricsPy/static/style.css
@@ -83,3 +83,37 @@ pre {
     border: 1px solid #ced4da;
     border-radius: 4px;
 }
+
+/* Styles for tabs */
+.tab {
+    overflow: hidden;
+    border-bottom: 1px solid #ccc;
+}
+
+.tab button {
+    background-color: lightblue;
+    border: none;
+    outline: none;
+    cursor: pointer;
+    padding: 14px 16px;
+    transition: 0.3s;
+    font-size: 17px;
+}
+
+.tab button:hover {
+    background-color: #0509e7;
+}
+
+.tab button.active {
+    background-color: #0509e7;
+}
+
+.tabcontent {
+    display: none;
+    padding: 20px 0;
+    border-top: none;
+}
+
+.tabcontent.active {
+    display: block;
+}
diff --git a/LyricsPy/templates/base.html b/LyricsPy/templates/base.html
index f8e7f95..70b8da2 100644
--- a/LyricsPy/templates/base.html
+++ b/LyricsPy/templates/base.html
@@ -2,19 +2,39 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Mis Letras de Canciones</title>
+    <title>My Song Lyrics</title>
     <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
 </head>
 <body>
     <div class="container">
-        <h1>Mis Letras de Canciones</h1>
+        <h1>My Song Lyrics</h1>
         <nav>
-            <a href="{{ url_for('index') }}">Inicio</a>
-            <a href="{{ url_for('add_song') }}">Añadir canción</a>
-            <a href="{{ url_for('add_album') }}">Añadir Álbum</a>
+            <a href="{{ url_for('index') }}">Home</a>
+            <a href="{{ url_for('add_song') }}">Add Song</a>
+            <a href="{{ url_for('add_album') }}">Add Album</a>
         </nav>
         <hr>
         {% block content %}{% endblock %}
     </div>
+    <script>
+        function openTab(evt, tabName) {
+            var i, tabcontent, tablinks;
+            tabcontent = document.getElementsByClassName("tabcontent");
+            for (i = 0; i < tabcontent.length; i++) {
+                tabcontent[i].style.display = "none";
+            }
+            tablinks = document.getElementsByClassName("tablinks");
+            for (i = 0; i < tablinks.length; i++) {
+                tablinks[i].className = tablinks[i].className.replace(" active", "");
+            }
+            document.getElementById(tabName).style.display = "block";
+            evt.currentTarget.className += " active";
+        }
+
+        // Default open tab
+        document.addEventListener('DOMContentLoaded', function () {
+            document.getElementsByClassName('tablinks')[0].click();
+        });
+    </script>
 </body>
 </html>
diff --git a/LyricsPy/templates/index.html b/LyricsPy/templates/index.html
index ec5a843..8834a14 100644
--- a/LyricsPy/templates/index.html
+++ b/LyricsPy/templates/index.html
@@ -1,21 +1,30 @@
 {% extends 'base.html' %}
 
 {% block content %}
-<h2>Lista de canciones</h2>
-<ul>
-    {% for song in songs %}
-    <li>
-        <a href="{{ url_for('song', song_id=song.id) }}">{{ song.title }} by {{ song.author }}</a>
-    </li>
-    {% endfor %}
-</ul>
-<hr>
-<h2>Álbumes</h2>
-<ul>
-    {% for album in albums %}
-    <li>{{ album.name }} by {{ album.artist }} ({{ album.year }})</li>
-    {% endfor %}
-</ul>
-<hr>
-<a href="{{ url_for('add_album') }}" class="button">Añadir nuevo álbum</a>
+<div class="tab">
+    <button class="tablinks" onclick="openTab(event, 'Songs')">Songs</button>
+    <button class="tablinks" onclick="openTab(event, 'Albums')">Albums</button>
+</div>
+
+<div id="Songs" class="tabcontent">
+    <h2>Song List</h2>
+    <ul>
+        {% for song in songs %}
+        <li>
+            <a href="{{ url_for('song', song_id=song.id) }}">{{ song.title }} by {{ song.author }}</a>
+        </li>
+        {% endfor %}
+    </ul>
+</div>
+
+<div id="Albums" class="tabcontent">
+    <h2>Albums</h2>
+    <ul>
+        {% for album in albums %}
+        <li>{{ album.name }} by {{ album.artist }} ({{ album.year }})</li>
+        {% endfor %}
+    </ul>
+    <hr>
+    <a href="{{ url_for('add_album') }}" class="button">Add New Album</a>
+</div>
 {% endblock %}
