diff --git a/src/demo/colors/Base.tsx b/src/demo/colors/Base.tsx
index defa1fa68d..2b2a86a020 100644
--- a/src/demo/colors/Base.tsx
+++ b/src/demo/colors/Base.tsx
@@ -338,6 +338,11 @@ const floats = [
         title: 'Float Hover',
         description: 'Hover for Float.',
     },
+    {
+        name: 'base-float-medium',
+        title: 'Float Medium',
+        description: 'Float for medium contrast.',
+    },
     {
         name: 'base-float-heavy',
         title: 'Float Heavy',
diff --git a/styles/themes/dark-hc/base.scss b/styles/themes/dark-hc/base.scss
index 2d5fde9de0..f868975406 100644
--- a/styles/themes/dark-hc/base.scss
+++ b/styles/themes/dark-hc/base.scss
@@ -73,6 +73,7 @@
     --g-color-base-float: var(--g-color-private-white-100-solid);
 
     --g-color-base-float-hover: var(--g-color-private-white-200-solid);
+    --g-color-base-float-medium: var(--g-color-private-white-200-solid);
     --g-color-base-float-heavy: var(--g-color-private-white-300-solid);
     --g-color-base-float-accent: var(--g-color-private-white-300-solid);
     --g-color-base-float-accent-hover: var(--g-color-private-white-400-solid);
diff --git a/styles/themes/dark/base.scss b/styles/themes/dark/base.scss
index f912867154..83df85f828 100644
--- a/styles/themes/dark/base.scss
+++ b/styles/themes/dark/base.scss
@@ -72,6 +72,7 @@
 
     --g-color-base-float: var(--g-color-private-white-100-solid);
     --g-color-base-float-hover: var(--g-color-private-white-150-solid);
+    --g-color-base-float-medium: var(--g-color-private-white-150-solid);
     --g-color-base-float-heavy: var(--g-color-private-white-250-solid);
     --g-color-base-float-accent: var(--g-color-private-white-150-solid);
     --g-color-base-float-accent-hover: var(--g-color-private-white-200-solid);
diff --git a/styles/themes/light-hc/base.scss b/styles/themes/light-hc/base.scss
index faccc88124..5b5e2b4609 100644
--- a/styles/themes/light-hc/base.scss
+++ b/styles/themes/light-hc/base.scss
@@ -72,6 +72,7 @@
 
     --g-color-base-float: var(--g-color-private-white-1000-solid);
     --g-color-base-float-hover: var(--g-color-private-black-150-solid);
+    --g-color-base-float-medium: var(--g-color-private-black-550-solid);
     --g-color-base-float-heavy: var(--g-color-private-black-700-solid);
     --g-color-base-float-accent: var(--g-color-private-white-1000-solid);
     --g-color-base-float-accent-hover: var(--g-color-private-white-850);
diff --git a/styles/themes/light/base.scss b/styles/themes/light/base.scss
index 969cddf055..57a09d43a3 100644
--- a/styles/themes/light/base.scss
+++ b/styles/themes/light/base.scss
@@ -72,6 +72,7 @@
 
     --g-color-base-float: var(--g-color-private-white-1000-solid);
     --g-color-base-float-hover: var(--g-color-private-black-50-solid);
+    --g-color-base-float-medium: var(--g-color-private-black-550-solid);
     --g-color-base-float-heavy: var(--g-color-private-black-700-solid);
     --g-color-base-float-accent: var(--g-color-private-white-1000-solid);
     --g-color-base-float-accent-hover: var(--g-color-private-white-850);