diff --git a/src/ux-components/checkbox/checkbox.vue b/src/ux-components/checkbox/checkbox.vue
index 73eb562bf..2d1c892b9 100644
--- a/src/ux-components/checkbox/checkbox.vue
+++ b/src/ux-components/checkbox/checkbox.vue
@@ -41,6 +41,13 @@ export default {
     &:checked {
       background-size: 125%;
       border: 1px solid $blue;
+      + label {
+        p {
+          font-weight: 500;
+          font-size: .875rem;
+          color: $black;
+        }
+      }
     }
     &:focus {
       box-shadow: 0 0 0 4px $blue-300;
@@ -51,5 +58,10 @@ export default {
       box-shadow: 0 0 0 4px $blue-300;
     }
   }
+  p {
+    font-weight: 400;
+    font-size: .875rem;
+    color: $gray-600;
+  }
 }
 </style>
diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue
index ed08026b2..44aa08880 100644
--- a/src/ux-components/radio/radio.vue
+++ b/src/ux-components/radio/radio.vue
@@ -89,6 +89,13 @@ export default {
       background-size: 71%;
       border: 1px solid $blue;
       background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' xml:space='preserve'%3e%3ccircle cx='25' cy='25' r='25' fill='%231574A1'/%3e%3c/svg%3e");
+      + label {
+        p {
+          font-weight: 500;
+          font-size: .875rem;
+          color: $black;
+        }
+      }
     }
     &:focus {
       box-shadow: 0 0 0 4px $blue-300;
@@ -99,5 +106,10 @@ export default {
       box-shadow: 0 0 0 4px $blue-300;
     }
   }
+  p {
+    font-weight: 400;
+    font-size: .875rem;
+    color: $gray-600;
+  }
 }
 </style>