diff --git a/webcompat/static/css/development/components/button.css b/webcompat/static/css/development/components/button.css
index 2ff2f303e..0deb84515 100644
--- a/webcompat/static/css/development/components/button.css
+++ b/webcompat/static/css/development/components/button.css
@@ -44,7 +44,8 @@
     text-decoration: none;
   }
 
-  .wc-Button:hover:not(.is-disabled) {
+  .wc-Button:hover:not(.is-disabled),
+  .wc-Button:focus:not(.is-disabled) {
     color:#fff;
   }
 
diff --git a/webcompat/static/css/development/components/hero.css b/webcompat/static/css/development/components/hero.css
index 1a7422f0a..688e862c6 100644
--- a/webcompat/static/css/development/components/hero.css
+++ b/webcompat/static/css/development/components/hero.css
@@ -1,4 +1,4 @@
-/** @define Hero */
+  /** @define Hero */
 
 :root {
   --Hero-fontSize: var(--base-fontSize);
@@ -59,11 +59,8 @@
   }
 
       /* event */
+      .wc-Hero-link:hover,
       .wc-Hero-link:focus {
-        color: #414042;
-      }
-
-      .wc-Hero-link:hover {
         text-decoration:none;
         color: #fff;
       }
diff --git a/webcompat/static/css/development/components/labels.css b/webcompat/static/css/development/components/labels.css
index 81ec72892..c9d820a90 100644
--- a/webcompat/static/css/development/components/labels.css
+++ b/webcompat/static/css/development/components/labels.css
@@ -15,7 +15,8 @@
   color: inherit;
 }
   /* state */
-  .wc-Labels:hover {
+  .wc-Labels:hover,
+  .wc-Labels:focus {
     text-decoration:none;
     opacity:1;
     border-color: #414042;
diff --git a/webcompat/static/css/development/components/navbar.css b/webcompat/static/css/development/components/navbar.css
index 734f199c6..dc7c0fd28 100644
--- a/webcompat/static/css/development/components/navbar.css
+++ b/webcompat/static/css/development/components/navbar.css
@@ -26,7 +26,8 @@
   .wc-Navbar-linkDropdown {
     display: block;
   }
-    .wc-Navbar-link:hover {
+    .wc-Navbar-link:hover,
+    .wc-Navbar-link:focus {
       color: #fff;
     }
     .wc-Navbar-linkDropdown:hover {
diff --git a/webcompat/static/css/development/components/tag.css b/webcompat/static/css/development/components/tag.css
index df85c35b5..bb7c3b60f 100644
--- a/webcompat/static/css/development/components/tag.css
+++ b/webcompat/static/css/development/components/tag.css
@@ -14,6 +14,7 @@
   margin:0 .8em .4em 0;
   color:#404040;
 }
+
   /* event */
   .wc-Tag--filter:hover,
   .wc-Tag.is-active,
@@ -25,6 +26,7 @@
   .wc-tag--filter {
     cursor:pointer;
   }
+
   .wc-Tag--label {
     color: #fff;
     padding: .36em 1.19em;
@@ -37,67 +39,79 @@
     }
   }
 
+  /* Tag new */
   .wc-Tag--new {
     border-color:var(--base-stateNew);
   }
 
     /* event */
-    .wc-Tag--new.wc-tag--filter:hover,
+    .wc-Tag--new.wc-tag--filter:hover
+    .wc-Tag--new.wc-tag--filter:focus,
     .wc-Tag--new.is-active,
     .wc-Tag--new.wc-Tag--label {
       background-color:var(--base-stateNew);
     }
 
+  /* Tag needsDiagnosis */
   .wc-Tag--needsDiagnosis {
     border-color:var(--base-stateNeedsDiagnosis);
   }
 
     /* event */
-    .wc-Tag--needsDiagnosis.wc-tag--filter:hover,
+    .wc-Tag--needsDiagnosis.wc-tag--filter:hover
+    .wc-Tag--needsDiagnosis.wc-tag--filter:focus,
     .wc-Tag--needsDiagnosis.is-active,
     .wc-Tag--needsDiagnosis.wc-Tag--label {
       background-color:var(--base-stateNeedsDiagnosis);
     }
 
+  /* Tag needsContact */
   .wc-Tag--needsContact {
     border-color:var(--base-stateNeedsContact);
   }
 
     /* event */
     .wc-Tag--needsContact.wc-tag--filter:hover,
+    .wc-Tag--needsContact.wc-tag--filter:focus,
     .wc-Tag--needsContact.is-active,
     .wc-Tag--needsContact.wc-Tag--label {
       background-color:var(--base-stateNeedsContact);
     }
 
+  /* Tag ready */
   .wc-Tag--ready {
     border-color:var(--base-stateReady);
   }
 
     /* event */
     .wc-Tag--ready.wc-tag--filter:hover,
+    .wc-Tag--ready.wc-tag--filter:focus,
     .wc-Tag--ready.is-active,
     .wc-Tag--ready.wc-Tag--label {
       background-color:var(--base-stateReady);
     }
 
+  /* Tag sitewait */
   .wc-Tag--sitewait {
     border-color:var(--base-stateSitewait);
   }
 
-  /* event */
-  .wc-Tag--sitewait.wc-tag--filter:hover,
-  .wc-Tag--sitewait.is-active,
-  .wc-Tag--sitewait.wc-Tag--label {
-    background-color:var(--base-stateSitewait);
-  }
+    /* event */
+    .wc-Tag--sitewait.wc-tag--filter:hover,
+    .wc-Tag--sitewait.wc-tag--filter:focus,
+    .wc-Tag--sitewait.is-active,
+    .wc-Tag--sitewait.wc-Tag--label {
+      background-color:var(--base-stateSitewait);
+    }
 
+  /* Tag close */
   .wc-Tag--close {
     border-color:var(--base-stateClose);
   }
 
     /* event */
     .wc-Tag--close.wc-tag--filter:hover,
+    .wc-Tag--close.wc-tag--filter:focus,
     .wc-Tag--close.is-active,
     .wc-Tag--close.wc-Tag--label {
       background-color:var(--base-stateClose);