diff --git a/recipify/recipify/templates/gallery.html b/recipify/recipify/templates/gallery.html
index 80ced54..1044696 100644
--- a/recipify/recipify/templates/gallery.html
+++ b/recipify/recipify/templates/gallery.html
@@ -99,7 +99,7 @@ <h1 class="mb-4 text-3xl font-extrabold text-gray-900 dark:text-white md:text-5x
         {% for image in images %}
         <div>
             <a href="{% url 'pick_recipe' image.id %}">
-            <img class="h-auto max-w-full rounded-lg" src="{{ image.image.url }}" alt="Gallery image" />
+            <img class="h-auto max-w-full rounded-lg hover-highlight" src="{{ image.image.url }}" alt="Gallery image" />
             </a>
         </div>
         {% endfor %}
diff --git a/recipify/static/css/gallery.css b/recipify/static/css/gallery.css
index ee5abf8..070d3f0 100644
--- a/recipify/static/css/gallery.css
+++ b/recipify/static/css/gallery.css
@@ -21,3 +21,10 @@
     max-height: 100%;
 }
 
+.hover-highlight {
+    transition: box-shadow 0.3s ease-in-out; /* Smooth transition */
+}
+
+.hover-highlight:hover {
+    opacity: 75%;
+}