diff --git a/TaikoWebUI/Pages/SongList.razor b/TaikoWebUI/Pages/SongList.razor
index 40eec12..8b9f3d7 100644
--- a/TaikoWebUI/Pages/SongList.razor
+++ b/TaikoWebUI/Pages/SongList.razor
@@ -92,13 +92,13 @@
                                 </a>
                             </div>
                             <div>
-                                <MudToggleIconButton
-                                    Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
-                                    ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
-                                    Size="Size.Small"
-                                    ToggledSize="Size.Small"
-                                    Title="Add to favorites"
-                                    ToggledTitle="Remove from favorites" />
+                                <MudToggleIconButton Toggled="@context.IsFavorite"
+                                                     ToggledChanged="@(async () => await OnFavoriteToggled(context))"
+                                                     Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
+                                                     ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
+                                                     Size="Size.Small"
+                                                     ToggledSize="Size.Small"
+                                                     Title="Add to favorites" ToggledTitle="Remove from favorites" />
                             </div>
                             </MudStack>
                         </MudTd>
diff --git a/TaikoWebUI/Pages/SongList.razor.cs b/TaikoWebUI/Pages/SongList.razor.cs
index d750956..670294e 100644
--- a/TaikoWebUI/Pages/SongList.razor.cs
+++ b/TaikoWebUI/Pages/SongList.razor.cs
@@ -71,4 +71,19 @@ public partial class SongList
 
         return true;
     }
+    
+    private async Task OnFavoriteToggled(MusicDetail data)
+    {
+        var request = new SetFavoriteRequest
+        {
+            Baid = (uint)Baid,
+            IsFavorite = !data.IsFavorite,
+            SongId = data.SongId
+        };
+        var result = await Client.PostAsJsonAsync("api/FavoriteSongs", request);
+        if (result.IsSuccessStatusCode)
+        {
+            data.IsFavorite = !data.IsFavorite;
+        }
+    }
 }