diff --git a/apps/core/tailwind.config.js b/apps/core/tailwind.config.js
index c25cd81f..51d93e15 100644
--- a/apps/core/tailwind.config.js
+++ b/apps/core/tailwind.config.js
@@ -1,4 +1,5 @@
 const reactantPreset = require('@bigcommerce/reactant/tailwind-config');
+const tailwindDefault = require('tailwindcss/stubs/config.full');
 
 /** @type {import('tailwindcss').Config} */
 const config = {
@@ -9,6 +10,59 @@ const config = {
     './node_modules/@bigcommerce/reactant/dist/**/*.{js,mjs}',
   ],
   plugins: [],
+  theme: {
+    extend: {
+      colors: tailwindDefault.theme.colors,
+      fontSize: tailwindDefault.theme.fontSize,
+    }
+  },
+  safelist: [
+    'bg-slate-200',
+    'bg-gray-200',
+    'bg-zinc-200',
+    'bg-neutral-200',
+    'bg-stone-200',
+    'bg-red-200',
+    'bg-orange-200',
+    'bg-amber-200',
+    'bg-yellow-200',
+    'bg-lime-200',
+    'bg-green-200',
+    'bg-emerald-200',
+    'bg-teal-200',
+    'bg-cyan-200',
+    'bg-sky-200',
+    'bg-blue-200',
+    'bg-indigo-200',
+    'bg-violet-200',
+    'bg-purple-200',
+    'bg-fuchsia-200',
+    'bg-pink-200',
+    'bg-rose-200',
+
+    'bg-slate-800',
+    'bg-gray-800',
+    'bg-zinc-800',
+    'bg-neutral-800',
+    'bg-stone-800',
+    'bg-red-800',
+    'bg-orange-800',
+    'bg-amber-800',
+    'bg-yellow-800',
+    'bg-lime-800',
+    'bg-green-800',
+    'bg-emerald-800',
+    'bg-teal-800',
+    'bg-cyan-800',
+    'bg-sky-800',
+    'bg-blue-800',
+    'bg-indigo-800',
+    'bg-violet-800',
+    'bg-purple-800',
+    'bg-fuchsia-800',
+    'bg-pink-800',
+    'bg-rose-800'
+  ]
 };
 
 module.exports = config;