diff --git a/client/src/components/LogoutWidget.vue b/client/src/components/LogoutWidget.vue
index 8c3271f7..45928c76 100644
--- a/client/src/components/LogoutWidget.vue
+++ b/client/src/components/LogoutWidget.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="logout-widget">
-    <button class="logout-widget__logout" data-cy="logout" @click="logout()">Logout</button>
+    <a class="logout-widget__logout" data-cy="logout" @click="logout()">Logout</a>
   </div>
 </template>
 
@@ -22,6 +22,7 @@
 
 <style scoped lang="scss">
   @import "@/styles/_variables.scss";
+  @import "@/styles/_mixins.scss";
 
   .logout-widget {
     color: $color-silver-dark;
@@ -29,14 +30,8 @@
     align-items: center;
 
     &__logout {
-      font-family: $sans-serif-font-family;
-      line-height: 16px;
-      background: none;
-      color: inherit;
-      border: none;
-      padding: 0;
+      @include regular-text;
       cursor: pointer;
-      outline: inherit;
     }
   }
 </style>