diff --git a/src/lib/components/blog/labels.svelte b/src/lib/components/blog/labels.svelte
index 4ef523f1a..134b8d04c 100644
--- a/src/lib/components/blog/labels.svelte
+++ b/src/lib/components/blog/labels.svelte
@@ -19,7 +19,8 @@
         href={makeBlogPostsPageUrl([label])}
         class:selected={selectedLabels.includes(label)}
         data-sveltekit-prefetch
-        target="_blank">#{label}</a
+        target="_blank"
+        rel="noopener noreferrer">#{label}</a
       >
     {/each}
   </div>
@@ -35,14 +36,17 @@
 
     a {
       background-color: var(--acm-light);
-      border-radius: 5px;
-      padding: 0.3em;
+      color: var(--acm-dark);
+      border-radius: var(--size-sm);
+      border: 2px solid #e0e0e0;
+      padding: 0.25em 0.8em 0.25em 0.8em;
       text-decoration: none;
     }
 
     .selected {
-      background-color: var(--acm-gray);
-      color: var(--perma-light);
+      background-color: #81d4fa;
+      border-color: #4fc3f7;
+      color: var(--perma-dark);
       pointer-events: not-allowed;
     }
   }
diff --git a/src/routes/(site)/blog/labelfield.svelte b/src/routes/(site)/blog/labelfield.svelte
index 7d1aa080a..33588543d 100644
--- a/src/routes/(site)/blog/labelfield.svelte
+++ b/src/routes/(site)/blog/labelfield.svelte
@@ -91,8 +91,8 @@
         margin-bottom: 0.2em;
         margin-right: var(--size-sm);
         padding: 0.25em 0.8em 0.25em 0.8em;
-        background-color: #eeeeee;
-        color: #212121;
+        background-color: var(--acm-light);
+        color: var(--acm-dark);
         border-radius: var(--size-sm);
         border: 2px solid #e0e0e0;
         cursor: pointer;
@@ -107,6 +107,7 @@
           transition: 1s ease-in-out;
           background-color: #81d4fa;
           border-color: #4fc3f7;
+          color: var(--acm-dark);
 
           &:before {
             content: '✓ ';