diff --git a/apps/docs/src/components/document/typography/font-weight-table.tsx b/apps/docs/src/components/document/typography/font-weight-table.tsx
index beb02a58b..31a9618dd 100644
--- a/apps/docs/src/components/document/typography/font-weight-table.tsx
+++ b/apps/docs/src/components/document/typography/font-weight-table.tsx
@@ -3,9 +3,9 @@ import { FontTable } from './font-table';
 
 export function FontWeightTable() {
   return (
-    <FontTable<string>
+    <FontTable<number>
       name="font-weight"
-      tokens={meta.light.resolved.primitive.font.size}
+      tokens={meta.light.resolved.primitive.font.weight}
       renderValue={(value) => value}
       renderExample={(value) => (
         <span style={{ fontWeight: value }}>Sample text</span>
diff --git a/apps/docs/src/components/document/typography/letter-spacing-table.tsx b/apps/docs/src/components/document/typography/letter-spacing-table.tsx
index 44d520294..eb4b0739f 100644
--- a/apps/docs/src/components/document/typography/letter-spacing-table.tsx
+++ b/apps/docs/src/components/document/typography/letter-spacing-table.tsx
@@ -1,14 +1,18 @@
 import { meta } from '@govie-ds/theme-govie';
 import { FontTable } from './font-table';
 
+function remToEm(value: string) {
+  return value.replace('rem', 'em');
+}
+
 export function LetterSpacingTable() {
   return (
     <FontTable<string>
       name="letter-spacing"
       tokens={meta.light.resolved.primitive.font.letterSpacing}
-      renderValue={(value) => value}
+      renderValue={(value) => remToEm(value)}
       renderExample={(value) => (
-        <span style={{ letterSpacing: value }}>Sample text</span>
+        <span style={{ letterSpacing: remToEm(value) }}>Sample text</span>
       )}
     />
   );