diff --git a/modules/frontend/src/pages/TitlesPage/TitlesPage.tsx b/modules/frontend/src/pages/TitlesPage/TitlesPage.tsx
index 481d116..449cb70 100644
--- a/modules/frontend/src/pages/TitlesPage/TitlesPage.tsx
+++ b/modules/frontend/src/pages/TitlesPage/TitlesPage.tsx
@@ -127,7 +127,16 @@ const handleLoadMore = async () => {
       </div>
        <TitlesFilterPanel filters={filters} setFilters={setFilters} />
 
-      {loading && <div className="mt-20 font-medium text-black">Loading...</div>}
+      {loading && (
+      <div className="mt-20 flex flex-col items-center justify-center space-y-4 font-medium text-black">
+        <span>Loading...</span>
+          <img 
+            src="https://images.steamusercontent.com/ugc/920301026407341369/69CBEF69DED504CD8CC7838D370061089F4D81BD/?imw=5000&imh=5000&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=false" 
+            alt="Loading animation" 
+            className="w-16 h-16 object-contain" 
+          />
+        </div>
+      )}
 
       {!loading && titles.length === 0 && (
         <div className="mt-20 font-medium text-black">No titles found.</div>