diff --git a/packages/ui/src/atoms/Menu.js b/packages/ui/src/atoms/Menu.js
index 95ce34eb5c2da083893bfab8b46b5a60a083d1e0..1c017b75887c1fe2f4053c29c3dd4a05d63b7601 100644
--- a/packages/ui/src/atoms/Menu.js
+++ b/packages/ui/src/atoms/Menu.js
@@ -65,7 +65,7 @@ const Option = styled.div.attrs({
   tabIndex: '0',
   'aria-selected': props => props.active,
 })`
-  color: ${props => (props.active ? 'black' : 'inherit')};
+  color: ${props => (props.active ? 'black' : '#444')};
   font-weight: ${props => (props.active ? '600' : 'inherit')};
   cursor: pointer;
   font-family: var(--font-author);
diff --git a/packages/ui/test/__snapshots__/Menu.test.js.snap b/packages/ui/test/__snapshots__/Menu.test.js.snap
index c45f23fff92de06b92b2a862e8cd014bcfb668f7..7b4ffde16ff0a2ff5002a64a988c6a3931582e2c 100644
--- a/packages/ui/test/__snapshots__/Menu.test.js.snap
+++ b/packages/ui/test/__snapshots__/Menu.test.js.snap
@@ -147,7 +147,7 @@ exports[`Menu is rendered correctly when open 1`] = `
 }
 
 .c10 {
-  color: inherit;
+  color: #444;
   font-weight: inherit;
   cursor: pointer;
   font-family: var(--font-author);