diff --git a/frontend/src/components/Image.tsx b/frontend/src/components/Image.tsx
index f199737d..170db31b 100644
--- a/frontend/src/components/Image.tsx
+++ b/frontend/src/components/Image.tsx
@@ -1,8 +1,6 @@
 const Image = () => {
   return (
-    <div>
-      <div className="animate-pulse bg-gray-200 w-full aspect-square"></div>
-    </div>
+    <div className="animate-pulse bg-gray-200 dark:bg-gray-800 w-full aspect-square" />
   );
 };
 
diff --git a/frontend/src/components/listings/ListingGridCard.tsx b/frontend/src/components/listings/ListingGridCard.tsx
index eebca524..5fe5f04d 100644
--- a/frontend/src/components/listings/ListingGridCard.tsx
+++ b/frontend/src/components/listings/ListingGridCard.tsx
@@ -26,6 +26,7 @@ const ListingGridCard = (props: Props) => {
       className={clsx(
         "transition-transform duration-100 ease-in-out transform cursor-pointer",
         "flex flex-col max-w-sm rounded material-card bg-white justify-between",
+        "dark:bg-gray-900",
         hovering ? "scale-105" : "scale-100",
       )}
       onMouseEnter={() => setHovering(true)}
@@ -45,21 +46,21 @@ const ListingGridCard = (props: Props) => {
       )}
       <div className="px-4 py-4 h-full">
         <CardHeader>
-          <CardTitle className="text-gray-500 text-xl min-h-6">
+          <CardTitle className="text-gray-500 dark:text-gray-300 text-xl min-h-6">
             {listing ? (
               listing.name
             ) : (
-              <div className="animate-pulse bg-gray-200 h-6 w-1/2 mb-2"></div>
+              <div className="animate-pulse bg-gray-200 dark:bg-gray-700 h-6 w-1/2 mb-2"></div>
             )}
           </CardTitle>
         </CardHeader>
-        <CardContent className="text-gray-500 max-h-32 overflow-hidden">
+        <CardContent className="text-gray-500 dark:text-gray-300 max-h-32 overflow-hidden">
           {listing ? (
             listing?.description && (
               <RenderDescription description={listing?.description} />
             )
           ) : (
-            <div className="animate-pulse bg-gray-200 h-6 w-full"></div>
+            <div className="animate-pulse bg-gray-200 dark:bg-gray-700 h-6 w-full"></div>
           )}
         </CardContent>
       </div>
diff --git a/frontend/src/pages/Browse.tsx b/frontend/src/pages/Browse.tsx
index 63aae77d..c0f12dd6 100644
--- a/frontend/src/pages/Browse.tsx
+++ b/frontend/src/pages/Browse.tsx
@@ -28,7 +28,7 @@ const Browse = () => {
 
   useEffect(() => {
     handleSearch();
-  }, [debouncedSearch]);
+  }, [debouncedSearch, pageNumber]);
 
   const handleSearch = async () => {
     setListingIds(null);
@@ -87,24 +87,22 @@ const Browse = () => {
 
         {hasButton && (
           <div className="flex justify-center mt-4">
-            <div className="inline-flex">
-              {prevButton && (
-                <button
-                  className="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded-l"
-                  onClick={() => navigate(`/browse/${pageNumber - 1}`)}
-                >
-                  Previous
-                </button>
-              )}
-              {nextButton && (
-                <button
-                  className="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded-r"
-                  onClick={() => navigate(`/browse/${pageNumber + 1}`)}
-                >
-                  Next
-                </button>
-              )}
-            </div>
+            {prevButton && (
+              <button
+                className="bg-gray-300 dark:bg-gray-700 hover:bg-gray-400 dark:hover:bg-gray-600 text-gray-800 dark:text-gray-300 font-bold py-2 px-4 rounded-l mr-auto"
+                onClick={() => navigate(`/browse/?page=${pageNumber - 1}`)}
+              >
+                Previous
+              </button>
+            )}
+            {nextButton && (
+              <button
+                className="bg-gray-300 dark:bg-gray-700 hover:bg-gray-400 dark:hover:bg-gray-600 text-gray-800 dark:text-gray-300 font-bold py-2 px-4 rounded-r ml-auto"
+                onClick={() => navigate(`/browse/?page=${pageNumber + 1}`)}
+              >
+                Next
+              </button>
+            )}
           </div>
         )}
       </div>