diff --git a/src/components/Eyebrow.tsx b/src/components/Eyebrow.tsx
index ffe04a4..afa13d7 100644
--- a/src/components/Eyebrow.tsx
+++ b/src/components/Eyebrow.tsx
@@ -36,7 +36,7 @@ const EyebrowContainer = styled.div<{
   display: none;
   align-items: center;
   padding: ${spacing.padding.small}px ${spacing.padding.medium}px;
-  background-color: ${(props) => (props.inverse ? 'rgba(0, 0, 0, 0.3)' : color.bluelight)};
+  background-color: ${(props) => (props.inverse ? 'rgba(0, 0, 0, 0.3)' : color.bluelighter)};
   box-shadow: ${(props) => (props.inverse ? 'rgba(255, 255, 255, 0.1)' : color.tr10)} 0 -1px 0px 0px
     inset;