diff --git a/src/common-elements/fields.ts b/src/common-elements/fields.ts
index 1267fc802f..f95781f49c 100644
--- a/src/common-elements/fields.ts
+++ b/src/common-elements/fields.ts
@@ -97,9 +97,11 @@ export const RecursiveLabel = styled(FieldLabel)`
 
 export const PatternLabel = styled(FieldLabel)`
   color: #0e7c86;
+  font-family: ${props => props.theme.typography.code.fontFamily};
+  font-size: 12px;
   &::before,
   &::after {
-    font-weight: bold;
+    content: ' ';
   }
 `;
 
diff --git a/src/components/__tests__/__snapshots__/FieldDetails.test.tsx.snap b/src/components/__tests__/__snapshots__/FieldDetails.test.tsx.snap
index f98b667a4f..a8b1a44fac 100644
--- a/src/components/__tests__/__snapshots__/FieldDetails.test.tsx.snap
+++ b/src/components/__tests__/__snapshots__/FieldDetails.test.tsx.snap
@@ -163,7 +163,7 @@ exports[`FieldDetailsComponent renders correctly when field items have string ty
     >
       [
       <span
-        class="sc-kpDqfm sc-eDPEul cGRfjn erJHow"
+        class="sc-kpDqfm sc-eDPEul cGRfjn cCKYVD"
       >
         ^see regex[0-9]$
       </span>