diff --git a/packages/react/src/components/MessageGenericPreview/MessageGenericPreview.js b/packages/react/src/components/MessageGenericPreview/MessageGenericPreview.js
index 7e100dd9f..a5fce3727 100644
--- a/packages/react/src/components/MessageGenericPreview/MessageGenericPreview.js
+++ b/packages/react/src/components/MessageGenericPreview/MessageGenericPreview.js
@@ -13,7 +13,7 @@ const MessageGenericPreview = (props, className = '', style = {}) => {
     padding: 0.75rem;
     border: 1px solid #ccc;
     border-radius: 5px;
-    background-color: #cbced1;
+    background-color: #eff0f1;
   `;
   return (
     <div
diff --git a/packages/react/src/components/MessageGenericPreview/MessageGenericPreviewFooter.js b/packages/react/src/components/MessageGenericPreview/MessageGenericPreviewFooter.js
index 79dc2c890..6648be05d 100644
--- a/packages/react/src/components/MessageGenericPreview/MessageGenericPreviewFooter.js
+++ b/packages/react/src/components/MessageGenericPreview/MessageGenericPreviewFooter.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import { css } from '@emotion/react';
 import useComponentOverrides from '../../theme/useComponentOverrides';
 
 const MessageGenericPreviewFooter = ({
@@ -10,9 +11,13 @@ const MessageGenericPreviewFooter = ({
   const { classNames, styleOverrides } = useComponentOverrides(
     'MessageGenericPreviewFooter'
   );
+  const MessageGenericPreviewFooterCss = css`
+    padding: 0.5rem 0;
+  `;
 
   return (
     <div
+      css={MessageGenericPreviewFooterCss}
       className={`ec-message-generic-preview__footer ${className} ${classNames}`}
       style={{ ...style, ...styleOverrides }}
       {...props}
diff --git a/packages/react/src/components/uiKit/blocks/ContextBlock.Item.js b/packages/react/src/components/uiKit/blocks/ContextBlock.Item.js
index ee77575f3..45641507d 100644
--- a/packages/react/src/components/uiKit/blocks/ContextBlock.Item.js
+++ b/packages/react/src/components/uiKit/blocks/ContextBlock.Item.js
@@ -9,8 +9,9 @@ const Item = ({ block: element, surfaceRenderer: parser, index }) => {
     useComponentOverrides('ContextBlockItem');
   const ContextBlockCss = css`
     display: inline-block;
+    padding: 0 0.75rem;
     font-size: 0.8rem;
-    color: #ffffff3f;
+    color: #3d3d3d;
     margin: -0.25rem;
   `;
   const renderedElement = parser.renderContextBlockElement(element, index);
diff --git a/packages/react/src/components/uiKit/blocks/ContextBlock.js b/packages/react/src/components/uiKit/blocks/ContextBlock.js
index 8eaff8b41..d891693ee 100644
--- a/packages/react/src/components/uiKit/blocks/ContextBlock.js
+++ b/packages/react/src/components/uiKit/blocks/ContextBlock.js
@@ -30,6 +30,7 @@ const ContextBlock = ({ className, block, surfaceRenderer }) => {
     >
       {itemElements.map((element, i) => (
         <Item
+          style={{ color: '#ccc' }}
           key={i}
           block={element}
           surfaceRenderer={surfaceRenderer}