diff --git a/webclient-vue/src/features/areas/pages/AreaFavoritesPage.vue b/webclient-vue/src/features/areas/pages/AreaFavoritesPage.vue
index cd0ab3e..1f2bb71 100644
--- a/webclient-vue/src/features/areas/pages/AreaFavoritesPage.vue
+++ b/webclient-vue/src/features/areas/pages/AreaFavoritesPage.vue
@@ -51,13 +51,12 @@
 
           <div class="area-favorite-actions">
             <button
-              class="btn-icon area-favorite-star"
-              :class="{ 'is-active': true }"
+              class="btn-icon area-favorite-remove"
               type="button"
-              :aria-label="'Unstar ' + area.display_name"
+              :aria-label="'Remove ' + area.display_name + ' from favorites'"
               @click.stop="favoritesStore.remove(area.id)"
             >
-              <i class="ph ph-star-fill" />
+              <i class="ph ph-x" />
             </button>
           </div>
         </article>
@@ -174,17 +173,17 @@
   text-decoration: underline;
 }
 
-.area-favorite-star {
+.area-favorite-remove {
   width: 40px;
   height: 40px;
-  color: var(--color-warning);
+  color: var(--color-muted);
 }
 
-.area-favorite-star:hover {
+.area-favorite-remove:hover {
   color: var(--color-danger);
 }
 
-.area-favorite-star .ph {
+.area-favorite-remove .ph {
   font-size: 22px;
 }