diff --git a/app/assets/stylesheets/badges.scss b/app/assets/stylesheets/badges.scss
index 8896d1478..c9f104902 100644
--- a/app/assets/stylesheets/badges.scss
+++ b/app/assets/stylesheets/badges.scss
@@ -2,6 +2,7 @@
   .badge-container {
     width: auto;
     background-color: white;
+    cursor: pointer;
 
     .badge-image-conatiner {
       width: auto;
diff --git a/app/views/badges/_badge_detail.html.erb b/app/views/badges/_badge_detail.html.erb
index b32cc50c7..824053244 100644
--- a/app/views/badges/_badge_detail.html.erb
+++ b/app/views/badges/_badge_detail.html.erb
@@ -10,6 +10,6 @@
       <h4 class="fw-800 fs-l color-grey-800"><%= badge.title %></h4>
       <p><%= badge.description %></p>
     </div>
-    <button class="flex flex-row items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()"><%= t("views.badges.gotit") %></button>
+    <button class="flex flex-row items-start c-btn c-btn--primary mt-4" onclick="window.Forem.closeModal()"><%= t("views.badges.gotit") %></button>
   </div>
 </div>
diff --git a/app/views/users/_badges_area.html.erb b/app/views/users/_badges_area.html.erb
index ee877d5da..95c1b0559 100644
--- a/app/views/users/_badges_area.html.erb
+++ b/app/views/users/_badges_area.html.erb
@@ -12,7 +12,7 @@
           <img src="<%= optimized_image_url(achievement.badge_image_url, width: 180) %>"
                alt="<%= achievement.badge_title %>"
                class="mx-auto max-w-75 h-auto align-middle"
-               style="object-fit: contain; width: 100%; aspect-ratio: 1 / 1; transform: rotate(<%= rand(-10..10) %>deg);"
+               style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; transform: rotate(<%= rand(-10..10) %>deg);"
                loading="lazy" />
         </div>