diff --git a/src/components/LeaderboardComponents/Leaderboard.vue b/src/components/LeaderboardComponents/Leaderboard.vue
index 48317805da23489922b3e7bd0cffbbca7fe30da7..73cc5da9cf9df92b12522a9577cf0e9a2c0faff9 100644
--- a/src/components/LeaderboardComponents/Leaderboard.vue
+++ b/src/components/LeaderboardComponents/Leaderboard.vue
@@ -131,7 +131,7 @@
     top: -0.5rem;
     background-color: #0A58CA;
     position: absolute;
-    left: -1rem;
+    /**left: -1rem;*/
     box-shadow: 0px 15px 11px -6px #7a7a7d;
   }
   
diff --git a/src/views/LeaderboardView.vue b/src/views/LeaderboardView.vue
index 7f58d1768c051c4c1b780a40ba89e02f88e6964d..681a963a43723485f5eac19e1a7b8b3d32753140 100644
--- a/src/views/LeaderboardView.vue
+++ b/src/views/LeaderboardView.vue
@@ -1,10 +1,26 @@
 <template>
+    <div id="dropdownContainer">
+        <Button class="btn btn-primary text-white leaderBoardButton">Global</Button>
+        <Button class="btn btn-primary text-white leaderBoardButton">Friends</Button>
+    </div>
     <main>
         <div id="leaderboard">
-            <h1>Ranking</h1>
+            <h1><img src="@/assets/items/v-buck.png" style="width: 2rem"> Total points</h1>
+            <Leaderboard :leaderboard="leaderboardData" @navigateToUserProfile="navigateToUserProfile" />
+        </div>
+        <div id="leaderboard">
+            <h1><img src="@/assets/icons/fire.png" style="width: 2rem"> Current streak</h1>
+            <Leaderboard :leaderboard="leaderboardData" @navigateToUserProfile="navigateToUserProfile" />
+        </div>
+        <div id="leaderboard">
+            <h1><img src="@/assets/icons/fire.png" style="width: 2rem"> Highest streak</h1>
             <Leaderboard :leaderboard="leaderboardData" @navigateToUserProfile="navigateToUserProfile" />
         </div>
     </main>
+    <div id = "communityContainer">
+        <h1>Total points earned as a community</h1>
+        <h2>1000000 <img src="@/assets/items/v-buck.png" style="width: 2rem"></h2>
+    </div>
 </template>
 
 <script setup lang="ts">
@@ -31,18 +47,49 @@ const navigateToUserProfile = (userId: number) => {
 
 <style scoped>
 main {
+    margin-top: 2rem;
+    margin-bottom: 4rem;
     width: 100%;
     display: flex;
-    justify-content: center;
+    justify-content: space-around;
     align-items: center;
+    flex-wrap: wrap;
+    flex-direction: row;
 }
 
 #leaderboard {
-    width: 60%;
+    width: 400px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     margin-bottom: 3rem;
 }
+
+h1 {
+    font-weight: 500;
+    margin-bottom: 1rem;
+}
+
+#dropdownContainer {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 2rem;
+    margin-top: 3rem;
+}
+
+#communityContainer {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    margin-bottom: 5rem;
+}
+
+.leaderBoardButton {
+  padding: 1rem 4rem;
+  font-weight: 700;
+  border-radius: 2rem;
+  margin: 1rem;
+}
 </style>
\ No newline at end of file