diff --git a/package-lock.json b/package-lock.json
index 607ccdce902..c545f1c4283 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -45507,6 +45507,7 @@
       "license": "MIT",
       "dependencies": {
         "@headlessui/react": "^1.0.0",
+        "@mertasan/tailwindcss-variables": "^2.0.1",
         "@radix-ui/colors": "^0.1.8",
         "@radix-ui/react-accordion": "^0.1.5",
         "@radix-ui/react-collapsible": "^0.1.5",
@@ -45522,7 +45523,9 @@
         "deepmerge": "^4.2.2",
         "formik": "^2.2.9",
         "lodash": "^4.17.20",
+        "postcss": "^8.4.5",
         "prop-types": "^15.7.2",
+        "tailwindcss": "^3.0.15",
         "tailwindcss-radix": "^1.6.0"
       },
       "devDependencies": {
@@ -58262,6 +58265,7 @@
       "version": "file:packages/common2",
       "requires": {
         "@headlessui/react": "^1.0.0",
+        "@mertasan/tailwindcss-variables": "^2.0.1",
         "@radix-ui/colors": "^0.1.8",
         "@radix-ui/react-accordion": "^0.1.5",
         "@radix-ui/react-collapsible": "^0.1.5",
@@ -58280,7 +58284,9 @@
         "deepmerge": "^4.2.2",
         "formik": "^2.2.9",
         "lodash": "^4.17.20",
+        "postcss": "^8.4.5",
         "prop-types": "^15.7.2",
+        "tailwindcss": "^3.0.15",
         "tailwindcss-radix": "^1.6.0",
         "tsconfig": "*",
         "typescript": "^4.5.3"
diff --git a/packages/common2/config.js b/packages/common2/config.js
new file mode 100644
index 00000000000..e760ba29c43
--- /dev/null
+++ b/packages/common2/config.js
@@ -0,0 +1,221 @@
+const deepMerge = require('deepmerge')
+const customFormsPlugin = require('@tailwindcss/forms')
+
+const colors = {
+  transparent: 'transparent',
+  white: '#ffffff',
+  black: '#000000',
+  gray: {
+    '50': '#f9fafb',
+    '100': '#f4f5f7',
+    '200': '#e5e7eb',
+    '300': '#d5d6d7',
+    '400': '#9e9e9e',
+    '500': '#707275',
+    '600': '#4c4f52',
+    '700': '#24262d',
+    '800': '#1a1c23',
+    '900': '#121317',
+    // default values from Tailwind UI palette
+    // '300': '#d2d6dc',
+    // '400': '#9fa6b2',
+    // '500': '#6b7280',
+    // '600': '#4b5563',
+    // '700': '#374151',
+    // '800': '#252f3f',
+    // '900': '#161e2e',
+  },
+  'cool-gray': {
+    '50': '#fbfdfe',
+    '100': '#f1f5f9',
+    '200': '#e2e8f0',
+    '300': '#cfd8e3',
+    '400': '#97a6ba',
+    '500': '#64748b',
+    '600': '#475569',
+    '700': '#364152',
+    '800': '#27303f',
+    '900': '#1a202e',
+  },
+  red: {
+    '50': '#fdf2f2',
+    '100': '#fde8e8',
+    '200': '#fbd5d5',
+    '300': '#f8b4b4',
+    '400': '#f98080',
+    '500': '#f05252',
+    '600': '#e02424',
+    '700': '#c81e1e',
+    '800': '#9b1c1c',
+    '900': '#771d1d',
+  },
+  orange: {
+    '50': '#fff8f1',
+    '100': '#feecdc',
+    '200': '#fcd9bd',
+    '300': '#fdba8c',
+    '400': '#ff8a4c',
+    '500': '#ff5a1f',
+    '600': '#d03801',
+    '700': '#b43403',
+    '800': '#8a2c0d',
+    '900': '#771d1d',
+  },
+  yellow: {
+    '50': '#fdfdea',
+    '100': '#fdf6b2',
+    '200': '#fce96a',
+    '300': '#faca15',
+    '400': '#e3a008',
+    '500': '#c27803',
+    '600': '#9f580a',
+    '700': '#8e4b10',
+    '800': '#723b13',
+    '900': '#633112',
+  },
+  green: {
+    '50': '#f3faf7',
+    '100': '#def7ec',
+    '200': '#bcf0da',
+    '300': '#84e1bc',
+    '400': '#31c48d',
+    '500': '#0e9f6e',
+    '600': '#057a55',
+    '700': '#046c4e',
+    '800': '#03543f',
+    '900': '#014737',
+  },
+  teal: {
+    '50': '#edfafa',
+    '100': '#d5f5f6',
+    '200': '#afecef',
+    '300': '#7edce2',
+    '400': '#16bdca',
+    '500': '#0694a2',
+    '600': '#047481',
+    '700': '#036672',
+    '800': '#05505c',
+    '900': '#014451',
+  },
+  blue: {
+    '50': '#ebf5ff',
+    '100': '#e1effe',
+    '200': '#c3ddfd',
+    '300': '#a4cafe',
+    '400': '#76a9fa',
+    '500': '#3f83f8',
+    '600': '#1c64f2',
+    '700': '#1a56db',
+    '800': '#1e429f',
+    '900': '#233876',
+  },
+  indigo: {
+    '50': '#f0f5ff',
+    '100': '#e5edff',
+    '200': '#cddbfe',
+    '300': '#b4c6fc',
+    '400': '#8da2fb',
+    '500': '#6875f5',
+    '600': '#5850ec',
+    '700': '#5145cd',
+    '800': '#42389d',
+    '900': '#362f78',
+  },
+  purple: {
+    '50': '#f6f5ff',
+    '100': '#edebfe',
+    '200': '#dcd7fe',
+    '300': '#cabffd',
+    '400': '#ac94fa',
+    '500': '#9061f9',
+    '600': '#7e3af2',
+    '700': '#6c2bd9',
+    '800': '#5521b5',
+    '900': '#4a1d96',
+  },
+  pink: {
+    '50': '#fdf2f8',
+    '100': '#fce8f3',
+    '200': '#fad1e8',
+    '300': '#f8b4d9',
+    '400': '#f17eb8',
+    '500': '#e74694',
+    '600': '#d61f69',
+    '700': '#bf125d',
+    '800': '#99154b',
+    '900': '#751a3d',
+  },
+}
+
+const backgroundOpacity = (theme) => ({
+  '10': '0.1',
+  ...theme('opacity'),
+})
+
+const maxHeight = (theme) => ({
+  '0': '0',
+  xl: '36rem',
+  ...theme('spacing'),
+})
+
+const windmillConfig = {
+  darkMode: 'class',
+  purge: {
+    content: [
+      'node_modules/@supabase/ui/theme/defaultTheme.js',
+      // 'node_modules/@supabase/ui/dist/index.js',
+    ],
+  },
+  theme: {
+    colors,
+    backgroundOpacity,
+    maxHeight,
+  },
+  variants: {
+    backgroundOpacity: ['responsive', 'hover', 'focus', 'dark'],
+    backgroundColor: ['responsive', 'hover', 'focus', 'active', 'odd', 'dark'],
+    display: ['responsive', 'dark'],
+    textColor: [
+      'responsive',
+      'focus',
+      'focus-within',
+      'hover',
+      'active',
+      'dark',
+    ],
+    placeholderColor: ['responsive', 'focus', 'dark'],
+    borderColor: ['responsive', 'hover', 'focus', 'dark'],
+    divideColor: ['responsive', 'dark'],
+    boxShadow: ['responsive', 'hover', 'focus', 'dark'],
+    margin: ['responsive', 'last'],
+  },
+  plugins: [customFormsPlugin],
+}
+
+function arrayMergeFn(destinationArray, sourceArray) {
+  return destinationArray.concat(sourceArray).reduce((acc, cur) => {
+    if (acc.includes(cur)) return acc
+    return [...acc, cur]
+  }, [])
+}
+
+/**
+ * Merge Windmill and Tailwind CSS configurations
+ * @param {object} tailwindConfig - Tailwind config object
+ * @return {object} new config object
+ */
+export function wrapper(tailwindConfig) {
+  let purge
+  if (Array.isArray(tailwindConfig.purge)) {
+    purge = {
+      content: tailwindConfig.purge,
+    }
+  } else {
+    purge = tailwindConfig.purge
+  }
+  return deepMerge({ ...tailwindConfig, purge }, windmillConfig, {
+    arrayMerge: arrayMergeFn,
+  })
+}
+
+// module.exports = wrapper
diff --git a/packages/common2/default-colors.js b/packages/common2/default-colors.js
new file mode 100644
index 00000000000..16352a83344
--- /dev/null
+++ b/packages/common2/default-colors.js
@@ -0,0 +1,90 @@
+module.exports = {
+  brand: {
+    brand1: 'hsla(153, 80%, 99%, 1)',
+    brand2: 'hsla(148, 88%, 97%, 1)',
+    brand3: 'hsla(148, 76%, 95%, 1)',
+    brand4: 'hsla(148, 68%, 92%, 1)',
+    brand5: 'hsla(148, 59%, 88%, 1)',
+    brand6: 'hsla(149, 43%, 82%, 1)',
+    brand7: 'hsla(149, 43%, 69%, 1)',
+    brand8: 'hsla(154, 55%, 45%, 1)',
+    brand9: 'hsla(153, 60%, 53%, 1)',
+    brand10: 'hsla(153, 50%, 50%, 1)',
+    brand11: 'hsla(153, 50%, 34%, 1)',
+    brand12: 'hsla(153, 40%, 12%, 1)',
+  },
+  brandDark: {
+    brand1: 'hsla(153, 75%, 6%, 1)',
+    brand2: 'hsla(153, 73%, 7%, 1)',
+    brand3: 'hsla(154, 69%, 9%, 1)',
+    brand4: 'hsla(154, 67%, 11%, 1)',
+    brand5: 'hsla(154, 66%, 13%, 1)',
+    brand6: 'hsla(154, 64%, 17%, 1)',
+    brand7: 'hsla(154, 62%, 22%, 1)',
+    brand8: 'hsla(153, 60%, 28%, 1)',
+    brand9: 'hsla(153, 60%, 53%, 1)',
+    brand10: 'hsla(153, 60%, 70%, 1)',
+    brand11: 'hsla(153, 60%, 50%, 1)',
+    brand12: 'hsla(153, 60%, 95%, 1)',
+  },
+  contrast: {
+    'brand-hiContrast': 'var(--colors-brand-9)',
+    'brand-loContrast': 'var(--colors-brand-4)',
+  },
+  scale: {
+    scale1: 'var(--colors-slate1)',
+    scale2: 'var(--colors-slate2)',
+    scale3: 'var(--colors-slate3)',
+    scale4: 'var(--colors-slate4)',
+    scale5: 'var(--colors-slate5)',
+    scale6: 'var(--colors-slate6)',
+    scale7: 'var(--colors-slate7)',
+    scale8: 'var(--colors-slate8)',
+    scale9: 'var(--colors-slate9)',
+    scale10: 'var(--colors-slate10)',
+    scale11: 'var(--colors-slate11)',
+    scale12: 'var(--colors-slate12)',
+  },
+  scaleA: {
+    scaleA1: 'var(--colors-slatea1)',
+    scaleA2: 'var(--colors-slatea2)',
+    scaleA3: 'var(--colors-slatea3)',
+    scaleA4: 'var(--colors-slatea4)',
+    scaleA5: 'var(--colors-slatea5)',
+    scaleA6: 'var(--colors-slatea6)',
+    scaleA7: 'var(--colors-slatea7)',
+    scaleA8: 'var(--colors-slatea8)',
+    scaleA9: 'var(--colors-slatea9)',
+    scaleA10: 'var(--colors-slatea10)',
+    scaleA11: 'var(--colors-slatea11)',
+    scaleA12: 'var(--colors-slatea12)',
+  },
+  scaleDark: {
+    scale1: 'var(--colors-gray1)',
+    scale2: 'var(--colors-gray2)',
+    scale3: 'var(--colors-gray3)',
+    scale4: 'var(--colors-gray4)',
+    scale5: 'var(--colors-gray5)',
+    scale6: 'var(--colors-gray6)',
+    scale7: 'var(--colors-gray7)',
+    scale8: 'var(--colors-gray8)',
+    scale9: 'var(--colors-gray9)',
+    scale10: 'var(--colors-gray10)',
+    scale11: 'var(--colors-gray11)',
+    scale12: 'var(--colors-gray12)',
+  },
+  scaleADark: {
+    scaleA1: 'var(--colors-graya1)',
+    scaleA2: 'var(--colors-graya2)',
+    scaleA3: 'var(--colors-graya3)',
+    scaleA4: 'var(--colors-graya4)',
+    scaleA5: 'var(--colors-graya5)',
+    scaleA6: 'var(--colors-graya6)',
+    scaleA7: 'var(--colors-graya7)',
+    scaleA8: 'var(--colors-graya8)',
+    scaleA9: 'var(--colors-graya9)',
+    scaleA10: 'var(--colors-graya10)',
+    scaleA11: 'var(--colors-graya11)',
+    scaleA12: 'var(--colors-graya12)',
+  },
+}
diff --git a/packages/common2/package.json b/packages/common2/package.json
index dcbeda4df9c..ac715f134e8 100644
--- a/packages/common2/package.json
+++ b/packages/common2/package.json
@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@headlessui/react": "^1.0.0",
+    "@mertasan/tailwindcss-variables": "^2.0.1",
     "@radix-ui/colors": "^0.1.8",
     "@radix-ui/react-accordion": "^0.1.5",
     "@radix-ui/react-collapsible": "^0.1.5",
@@ -24,7 +25,9 @@
     "deepmerge": "^4.2.2",
     "formik": "^2.2.9",
     "lodash": "^4.17.20",
+    "postcss": "^8.4.5",
     "prop-types": "^15.7.2",
+    "tailwindcss": "^3.0.15",
     "tailwindcss-radix": "^1.6.0"
   },
   "devDependencies": {
diff --git a/packages/common2/radix-colors.js b/packages/common2/radix-colors.js
new file mode 100644
index 00000000000..51e5115c33c
--- /dev/null
+++ b/packages/common2/radix-colors.js
@@ -0,0 +1,1349 @@
+export const radix_light = {
+  '--colors-gray1': 'hsl(0 0% 99%)',
+  '--colors-gray2': 'hsl(0 0% 97.3%)',
+  '--colors-gray3': 'hsl(0 0% 95.1%)',
+  '--colors-gray4': 'hsl(0 0% 93%)',
+  '--colors-gray5': 'hsl(0 0% 90.9%)',
+  '--colors-gray6': 'hsl(0 0% 88.7%)',
+  '--colors-gray7': 'hsl(0 0% 85.8%)',
+  '--colors-gray8': 'hsl(0 0% 78%)',
+  '--colors-gray9': 'hsl(0 0% 56.1%)',
+  '--colors-gray10': 'hsl(0 0% 52.3%)',
+  '--colors-gray11': 'hsl(0 0% 43.5%)',
+  '--colors-gray12': 'hsl(0 0% 9%)',
+  '--colors-mauve1': 'hsl(300 20% 99%)',
+  '--colors-mauve2': 'hsl(300 7.7% 97.5%)',
+  '--colors-mauve3': 'hsl(294 5.5% 95.3%)',
+  '--colors-mauve4': 'hsl(289 4.7% 93.3%)',
+  '--colors-mauve5': 'hsl(283 4.4% 91.3%)',
+  '--colors-mauve6': 'hsl(278 4.1% 89.1%)',
+  '--colors-mauve7': 'hsl(271 3.9% 86.3%)',
+  '--colors-mauve8': 'hsl(255 3.7% 78.8%)',
+  '--colors-mauve9': 'hsl(252 4% 57.3%)',
+  '--colors-mauve10': 'hsl(253 3.5% 53.5%)',
+  '--colors-mauve11': 'hsl(252 4% 44.8%)',
+  '--colors-mauve12': 'hsl(260 25% 11%)',
+  '--colors-slate1': 'hsl(206 30% 98.8%)',
+  '--colors-slate2': 'hsl(210 16.7% 97.6%)',
+  '--colors-slate3': 'hsl(209 13.3% 95.3%)',
+  '--colors-slate4': 'hsl(209 12.2% 93.2%)',
+  '--colors-slate5': 'hsl(208 11.7% 91.1%)',
+  '--colors-slate6': 'hsl(208 11.3% 88.9%)',
+  '--colors-slate7': 'hsl(207 11.1% 85.9%)',
+  '--colors-slate8': 'hsl(205 10.7% 78%)',
+  '--colors-slate9': 'hsl(206 6% 56.1%)',
+  '--colors-slate10': 'hsl(206 5.8% 52.3%)',
+  '--colors-slate11': 'hsl(206 6% 43.5%)',
+  '--colors-slate12': 'hsl(206 24% 9%)',
+  '--colors-sage1': 'hsl(155 30% 98.8%)',
+  '--colors-sage2': 'hsl(150 16.7% 97.6%)',
+  '--colors-sage3': 'hsl(151 10.6% 95.2%)',
+  '--colors-sage4': 'hsl(151 8.8% 93%)',
+  '--colors-sage5': 'hsl(151 7.8% 90.8%)',
+  '--colors-sage6': 'hsl(152 7.2% 88.4%)',
+  '--colors-sage7': 'hsl(153 6.7% 85.3%)',
+  '--colors-sage8': 'hsl(154 6.1% 77.5%)',
+  '--colors-sage9': 'hsl(155 3.5% 55.5%)',
+  '--colors-sage10': 'hsl(154 2.8% 51.7%)',
+  '--colors-sage11': 'hsl(155 3% 43%)',
+  '--colors-sage12': 'hsl(155 24% 9%)',
+  '--colors-olive1': 'hsl(110 20% 99%)',
+  '--colors-olive2': 'hsl(120 16.7% 97.6%)',
+  '--colors-olive3': 'hsl(119 10.1% 95.2%)',
+  '--colors-olive4': 'hsl(118 8.1% 93%)',
+  '--colors-olive5': 'hsl(117 7.1% 90.8%)',
+  '--colors-olive6': 'hsl(115 6.4% 88.5%)',
+  '--colors-olive7': 'hsl(114 5.9% 85.4%)',
+  '--colors-olive8': 'hsl(110 5.2% 77.3%)',
+  '--colors-olive9': 'hsl(110 3.5% 55.5%)',
+  '--colors-olive10': 'hsl(111 2.8% 51.7%)',
+  '--colors-olive11': 'hsl(110 3% 43%)',
+  '--colors-olive12': 'hsl(110 25% 9.5%)',
+  '--colors-sand1': 'hsl(50 20% 99%)',
+  '--colors-sand2': 'hsl(60 7.7% 97.5%)',
+  '--colors-sand3': 'hsl(59 6.5% 95.1%)',
+  '--colors-sand4': 'hsl(58 6.1% 92.9%)',
+  '--colors-sand5': 'hsl(57 6% 90.7%)',
+  '--colors-sand6': 'hsl(56 5.9% 88.4%)',
+  '--colors-sand7': 'hsl(55 5.9% 85.2%)',
+  '--colors-sand8': 'hsl(51 6% 77.1%)',
+  '--colors-sand9': 'hsl(50 2% 55.7%)',
+  '--colors-sand10': 'hsl(55 1.7% 51.9%)',
+  '--colors-sand11': 'hsl(50 2% 43.1%)',
+  '--colors-sand12': 'hsl(50 6% 10%)',
+  '--colors-tomato1': 'hsl(10 100% 99.4%)',
+  '--colors-tomato2': 'hsl(8 100% 98.4%)',
+  '--colors-tomato3': 'hsl(8 100% 96.6%)',
+  '--colors-tomato4': 'hsl(8 100% 94.3%)',
+  '--colors-tomato5': 'hsl(8 92.8% 91%)',
+  '--colors-tomato6': 'hsl(9 84.7% 86.3%)',
+  '--colors-tomato7': 'hsl(10 77.3% 79.5%)',
+  '--colors-tomato8': 'hsl(10 71.6% 71%)',
+  '--colors-tomato9': 'hsl(10 78% 54%)',
+  '--colors-tomato10': 'hsl(10 71.5% 50%)',
+  '--colors-tomato11': 'hsl(10 82% 43.5%)',
+  '--colors-tomato12': 'hsl(10 50% 13.5%)',
+  '--colors-red1': 'hsl(359 100% 99.4%)',
+  '--colors-red2': 'hsl(359 100% 98.6%)',
+  '--colors-red3': 'hsl(360 100% 96.8%)',
+  '--colors-red4': 'hsl(360 97.9% 94.8%)',
+  '--colors-red5': 'hsl(360 90.2% 91.9%)',
+  '--colors-red6': 'hsl(360 81.7% 87.8%)',
+  '--colors-red7': 'hsl(359 74.2% 81.7%)',
+  '--colors-red8': 'hsl(359 69.5% 74.3%)',
+  '--colors-red9': 'hsl(358 75% 59%)',
+  '--colors-red10': 'hsl(358 69.4% 55.2%)',
+  '--colors-red11': 'hsl(358 65% 48.7%)',
+  '--colors-red12': 'hsl(354 50% 14.6%)',
+  '--colors-crimson1': 'hsl(332 100% 99.4%)',
+  '--colors-crimson2': 'hsl(330 100% 98.4%)',
+  '--colors-crimson3': 'hsl(331 85.6% 96.6%)',
+  '--colors-crimson4': 'hsl(331 78.1% 94.2%)',
+  '--colors-crimson5': 'hsl(332 72.1% 91.1%)',
+  '--colors-crimson6': 'hsl(333 67% 86.7%)',
+  '--colors-crimson7': 'hsl(335 63.5% 80.4%)',
+  '--colors-crimson8': 'hsl(336 62.3% 72.9%)',
+  '--colors-crimson9': 'hsl(336 80% 57.8%)',
+  '--colors-crimson10': 'hsl(336 73.7% 53.5%)',
+  '--colors-crimson11': 'hsl(336 75% 47.2%)',
+  '--colors-crimson12': 'hsl(340 65% 14.5%)',
+  '--colors-pink1': 'hsl(322 100% 99.4%)',
+  '--colors-pink2': 'hsl(323 100% 98.4%)',
+  '--colors-pink3': 'hsl(323 86.3% 96.5%)',
+  '--colors-pink4': 'hsl(323 78.7% 94.2%)',
+  '--colors-pink5': 'hsl(323 72.2% 91.1%)',
+  '--colors-pink6': 'hsl(323 66.3% 86.6%)',
+  '--colors-pink7': 'hsl(323 62% 80.1%)',
+  '--colors-pink8': 'hsl(323 60.3% 72.4%)',
+  '--colors-pink9': 'hsl(322 65% 54.5%)',
+  '--colors-pink10': 'hsl(322 63.9% 50.7%)',
+  '--colors-pink11': 'hsl(322 75% 46%)',
+  '--colors-pink12': 'hsl(320 70% 13.5%)',
+  '--colors-plum1': 'hsl(292 90% 99.4%)',
+  '--colors-plum2': 'hsl(300 100% 98.6%)',
+  '--colors-plum3': 'hsl(299 71.2% 96.4%)',
+  '--colors-plum4': 'hsl(299 62% 93.8%)',
+  '--colors-plum5': 'hsl(298 56.1% 90.5%)',
+  '--colors-plum6': 'hsl(296 51.3% 85.8%)',
+  '--colors-plum7': 'hsl(295 48.2% 78.9%)',
+  '--colors-plum8': 'hsl(292 47.7% 70.8%)',
+  '--colors-plum9': 'hsl(292 45% 51%)',
+  '--colors-plum10': 'hsl(292 50.2% 46.9%)',
+  '--colors-plum11': 'hsl(292 60% 42.5%)',
+  '--colors-plum12': 'hsl(291 66% 14%)',
+  '--colors-purple1': 'hsl(280 65% 99.4%)',
+  '--colors-purple2': 'hsl(276 100% 99%)',
+  '--colors-purple3': 'hsl(276 83.1% 97%)',
+  '--colors-purple4': 'hsl(275 76.4% 94.7%)',
+  '--colors-purple5': 'hsl(275 70.8% 91.8%)',
+  '--colors-purple6': 'hsl(274 65.4% 87.8%)',
+  '--colors-purple7': 'hsl(273 61% 81.7%)',
+  '--colors-purple8': 'hsl(272 60% 73.5%)',
+  '--colors-purple9': 'hsl(272 51% 54%)',
+  '--colors-purple10': 'hsl(272 46.8% 50.3%)',
+  '--colors-purple11': 'hsl(272 50% 45.8%)',
+  '--colors-purple12': 'hsl(272 66% 16%)',
+  '--colors-violet1': 'hsl(255 65% 99.4%)',
+  '--colors-violet2': 'hsl(252 100% 99%)',
+  '--colors-violet3': 'hsl(252 96.9% 97.4%)',
+  '--colors-violet4': 'hsl(252 91.5% 95.5%)',
+  '--colors-violet5': 'hsl(252 85.1% 93%)',
+  '--colors-violet6': 'hsl(252 77.8% 89.4%)',
+  '--colors-violet7': 'hsl(252 71% 83.7%)',
+  '--colors-violet8': 'hsl(252 68.6% 76.3%)',
+  '--colors-violet9': 'hsl(252 56% 57.5%)',
+  '--colors-violet10': 'hsl(251 48.1% 53.5%)',
+  '--colors-violet11': 'hsl(250 43% 48%)',
+  '--colors-violet12': 'hsl(254 60% 18.5%)',
+  '--colors-indigo1': 'hsl(225 60% 99.4%)',
+  '--colors-indigo2': 'hsl(223 100% 98.6%)',
+  '--colors-indigo3': 'hsl(223 98.4% 97.1%)',
+  '--colors-indigo4': 'hsl(223 92.9% 95%)',
+  '--colors-indigo5': 'hsl(224 87.1% 92%)',
+  '--colors-indigo6': 'hsl(224 81.9% 87.8%)',
+  '--colors-indigo7': 'hsl(225 77.4% 82.1%)',
+  '--colors-indigo8': 'hsl(226 75.4% 74.5%)',
+  '--colors-indigo9': 'hsl(226 70% 55.5%)',
+  '--colors-indigo10': 'hsl(226 58.6% 51.3%)',
+  '--colors-indigo11': 'hsl(226 55% 45%)',
+  '--colors-indigo12': 'hsl(226 62% 17%)',
+  '--colors-blue1': 'hsl(206 100% 99.2%)',
+  '--colors-blue2': 'hsl(210 100% 98%)',
+  '--colors-blue3': 'hsl(209 100% 96.5%)',
+  '--colors-blue4': 'hsl(210 98.8% 94%)',
+  '--colors-blue5': 'hsl(209 95% 90.1%)',
+  '--colors-blue6': 'hsl(209 81.2% 84.5%)',
+  '--colors-blue7': 'hsl(208 77.5% 76.9%)',
+  '--colors-blue8': 'hsl(206 81.9% 65.3%)',
+  '--colors-blue9': 'hsl(206 100% 50%)',
+  '--colors-blue10': 'hsl(208 100% 47.3%)',
+  '--colors-blue11': 'hsl(211 100% 43.2%)',
+  '--colors-blue12': 'hsl(211 100% 15%)',
+  '--colors-sky1': 'hsl(193 100% 98.8%)',
+  '--colors-sky2': 'hsl(193 100% 97.3%)',
+  '--colors-sky3': 'hsl(193 99% 94.7%)',
+  '--colors-sky4': 'hsl(193 91.4% 91.4%)',
+  '--colors-sky5': 'hsl(194 82% 86.6%)',
+  '--colors-sky6': 'hsl(194 74.1% 79.5%)',
+  '--colors-sky7': 'hsl(194 72.3% 69.6%)',
+  '--colors-sky8': 'hsl(193 77.9% 53.9%)',
+  '--colors-sky9': 'hsl(193 98% 70%)',
+  '--colors-sky10': 'hsl(193 87% 66.5%)',
+  '--colors-sky11': 'hsl(195 100% 31.5%)',
+  '--colors-sky12': 'hsl(195 100% 13%)',
+  '--colors-mint1': 'hsl(165 80% 98.8%)',
+  '--colors-mint2': 'hsl(164 88.2% 96.7%)',
+  '--colors-mint3': 'hsl(164 76.6% 93.3%)',
+  '--colors-mint4': 'hsl(165 68.8% 89.5%)',
+  '--colors-mint5': 'hsl(165 60.6% 84.5%)',
+  '--colors-mint6': 'hsl(165 53.5% 76.9%)',
+  '--colors-mint7': 'hsl(166 50.7% 66.1%)',
+  '--colors-mint8': 'hsl(168 52.8% 51%)',
+  '--colors-mint9': 'hsl(167 65% 66%)',
+  '--colors-mint10': 'hsl(167 59.3% 63.1%)',
+  '--colors-mint11': 'hsl(172 72% 28.5%)',
+  '--colors-mint12': 'hsl(172 70% 12%)',
+  '--colors-cyan1': 'hsl(185 60% 98.7%)',
+  '--colors-cyan2': 'hsl(185 73.3% 97.1%)',
+  '--colors-cyan3': 'hsl(186 70.2% 94.4%)',
+  '--colors-cyan4': 'hsl(186 63.8% 90.6%)',
+  '--colors-cyan5': 'hsl(187 58.3% 85.4%)',
+  '--colors-cyan6': 'hsl(188 54.6% 78.4%)',
+  '--colors-cyan7': 'hsl(189 53.7% 68.7%)',
+  '--colors-cyan8': 'hsl(189 60.3% 52.5%)',
+  '--colors-cyan9': 'hsl(190 95% 39%)',
+  '--colors-cyan10': 'hsl(191 91.2% 36.8%)',
+  '--colors-cyan11': 'hsl(192 85% 31%)',
+  '--colors-cyan12': 'hsl(192 88% 12.5%)',
+  '--colors-teal1': 'hsl(165 60% 98.8%)',
+  '--colors-teal2': 'hsl(169 64.7% 96.7%)',
+  '--colors-teal3': 'hsl(169 59.8% 94%)',
+  '--colors-teal4': 'hsl(169 53.1% 90.2%)',
+  '--colors-teal5': 'hsl(170 47.1% 85%)',
+  '--colors-teal6': 'hsl(170 42.6% 77.9%)',
+  '--colors-teal7': 'hsl(170 39.9% 68.1%)',
+  '--colors-teal8': 'hsl(172 42.1% 52.5%)',
+  '--colors-teal9': 'hsl(173 80% 36%)',
+  '--colors-teal10': 'hsl(173 83.4% 32.5%)',
+  '--colors-teal11': 'hsl(174 90% 25.2%)',
+  '--colors-teal12': 'hsl(170 50% 12.5%)',
+  '--colors-green1': 'hsl(136 50% 98.9%)',
+  '--colors-green2': 'hsl(138 62.5% 96.9%)',
+  '--colors-green3': 'hsl(139 55.2% 94.5%)',
+  '--colors-green4': 'hsl(140 48.7% 91%)',
+  '--colors-green5': 'hsl(141 43.7% 86%)',
+  '--colors-green6': 'hsl(143 40.3% 79%)',
+  '--colors-green7': 'hsl(146 38.5% 69%)',
+  '--colors-green8': 'hsl(151 40.2% 54.1%)',
+  '--colors-green9': 'hsl(151 55% 41.5%)',
+  '--colors-green10': 'hsl(152 57.5% 37.6%)',
+  '--colors-green11': 'hsl(153 67% 28.5%)',
+  '--colors-green12': 'hsl(155 40% 14%)',
+  '--colors-grass1': 'hsl(116 50% 98.9%)',
+  '--colors-grass2': 'hsl(120 60% 97.1%)',
+  '--colors-grass3': 'hsl(120 53.6% 94.8%)',
+  '--colors-grass4': 'hsl(121 47.5% 91.4%)',
+  '--colors-grass5': 'hsl(122 42.6% 86.5%)',
+  '--colors-grass6': 'hsl(124 39% 79.7%)',
+  '--colors-grass7': 'hsl(126 37.1% 70.2%)',
+  '--colors-grass8': 'hsl(131 38.1% 56.3%)',
+  '--colors-grass9': 'hsl(131 41% 46.5%)',
+  '--colors-grass10': 'hsl(132 43.1% 42.2%)',
+  '--colors-grass11': 'hsl(133 50% 32.5%)',
+  '--colors-grass12': 'hsl(130 30% 14.9%)',
+  '--colors-lime1': 'hsl(85 50% 98.7%)',
+  '--colors-lime2': 'hsl(85 66.7% 96.5%)',
+  '--colors-lime3': 'hsl(85 76% 92.3%)',
+  '--colors-lime4': 'hsl(84 75.3% 87.5%)',
+  '--colors-lime5': 'hsl(84 71.5% 81.9%)',
+  '--colors-lime6': 'hsl(82 65% 74.6%)',
+  '--colors-lime7': 'hsl(79 53.2% 61.8%)',
+  '--colors-lime8': 'hsl(76 61.7% 45.1%)',
+  '--colors-lime9': 'hsl(81 67% 50%)',
+  '--colors-lime10': 'hsl(80 68.3% 46.9%)',
+  '--colors-lime11': 'hsl(75 80% 26%)',
+  '--colors-lime12': 'hsl(78 70% 11.5%)',
+  '--colors-yellow1': 'hsl(60 54% 98.5%)',
+  '--colors-yellow2': 'hsl(52 100% 95.5%)',
+  '--colors-yellow3': 'hsl(55 100% 90.9%)',
+  '--colors-yellow4': 'hsl(54 100% 86.6%)',
+  '--colors-yellow5': 'hsl(52 97.9% 82%)',
+  '--colors-yellow6': 'hsl(50 89.4% 76.1%)',
+  '--colors-yellow7': 'hsl(47 80.4% 68%)',
+  '--colors-yellow8': 'hsl(48 100% 46.1%)',
+  '--colors-yellow9': 'hsl(53 92% 50%)',
+  '--colors-yellow10': 'hsl(50 100% 48.5%)',
+  '--colors-yellow11': 'hsl(42 100% 29%)',
+  '--colors-yellow12': 'hsl(40 55% 13.5%)',
+  '--colors-amber1': 'hsl(39 70% 99%)',
+  '--colors-amber2': 'hsl(40 100% 96.5%)',
+  '--colors-amber3': 'hsl(44 100% 91.7%)',
+  '--colors-amber4': 'hsl(43 100% 86.8%)',
+  '--colors-amber5': 'hsl(42 100% 81.8%)',
+  '--colors-amber6': 'hsl(38 99.7% 76.3%)',
+  '--colors-amber7': 'hsl(36 86.1% 67.1%)',
+  '--colors-amber8': 'hsl(35 85.2% 55.1%)',
+  '--colors-amber9': 'hsl(39 100% 57%)',
+  '--colors-amber10': 'hsl(35 100% 55.5%)',
+  '--colors-amber11': 'hsl(30 100% 34%)',
+  '--colors-amber12': 'hsl(20 80% 17%)',
+  '--colors-orange1': 'hsl(24 70% 99%)',
+  '--colors-orange2': 'hsl(24 83.3% 97.6%)',
+  '--colors-orange3': 'hsl(24 100% 95.3%)',
+  '--colors-orange4': 'hsl(25 100% 92.2%)',
+  '--colors-orange5': 'hsl(25 100% 88.2%)',
+  '--colors-orange6': 'hsl(25 100% 82.8%)',
+  '--colors-orange7': 'hsl(24 100% 75.3%)',
+  '--colors-orange8': 'hsl(24 94.5% 64.3%)',
+  '--colors-orange9': 'hsl(24 94% 50%)',
+  '--colors-orange10': 'hsl(24 100% 46.5%)',
+  '--colors-orange11': 'hsl(24 100% 37%)',
+  '--colors-orange12': 'hsl(15 60% 17%)',
+  '--colors-brown1': 'hsl(30 40% 99.1%)',
+  '--colors-brown2': 'hsl(30 50% 97.6%)',
+  '--colors-brown3': 'hsl(30 52.5% 94.6%)',
+  '--colors-brown4': 'hsl(30 53% 91.2%)',
+  '--colors-brown5': 'hsl(29 52.9% 86.8%)',
+  '--colors-brown6': 'hsl(29 52.5% 80.9%)',
+  '--colors-brown7': 'hsl(29 51.5% 72.8%)',
+  '--colors-brown8': 'hsl(28 50% 63.1%)',
+  '--colors-brown9': 'hsl(28 34% 51%)',
+  '--colors-brown10': 'hsl(27 31.8% 47.6%)',
+  '--colors-brown11': 'hsl(25 30% 41%)',
+  '--colors-brown12': 'hsl(20 30% 19%)',
+  '--colors-bronze1': 'hsl(15 30% 99.1%)',
+  '--colors-bronze2': 'hsl(17 63.6% 97.8%)',
+  '--colors-bronze3': 'hsl(17 42.1% 95.2%)',
+  '--colors-bronze4': 'hsl(17 35.2% 92.1%)',
+  '--colors-bronze5': 'hsl(17 31.5% 88.2%)',
+  '--colors-bronze6': 'hsl(17 29% 83%)',
+  '--colors-bronze7': 'hsl(17 26.9% 75.6%)',
+  '--colors-bronze8': 'hsl(17 25.1% 66.5%)',
+  '--colors-bronze9': 'hsl(17 20% 54%)',
+  '--colors-bronze10': 'hsl(17 18.1% 50.1%)',
+  '--colors-bronze11': 'hsl(15 20% 43.1%)',
+  '--colors-bronze12': 'hsl(12 22% 21.5%)',
+  '--colors-gold1': 'hsl(50 20% 99.1%)',
+  '--colors-gold2': 'hsl(47 52.9% 96.7%)',
+  '--colors-gold3': 'hsl(46 38.2% 93.7%)',
+  '--colors-gold4': 'hsl(44 32.7% 90.1%)',
+  '--colors-gold5': 'hsl(43 29.9% 85.7%)',
+  '--colors-gold6': 'hsl(41 28.3% 79.8%)',
+  '--colors-gold7': 'hsl(39 27.6% 71.9%)',
+  '--colors-gold8': 'hsl(36 27.2% 61.8%)',
+  '--colors-gold9': 'hsl(36 20% 49.5%)',
+  '--colors-gold10': 'hsl(36 19.8% 45.7%)',
+  '--colors-gold11': 'hsl(36 20% 39%)',
+  '--colors-gold12': 'hsl(36 16% 20%)',
+  '--colors-grayA1': 'hsl(0 0% 0% / 0.012)',
+  '--colors-grayA2': 'hsl(0 0% 0% / 0.027)',
+  '--colors-grayA3': 'hsl(0 0% 0% / 0.047)',
+  '--colors-grayA4': 'hsl(0 0% 0% / 0.071)',
+  '--colors-grayA5': 'hsl(0 0% 0% / 0.09)',
+  '--colors-grayA6': 'hsl(0 0% 0% / 0.114)',
+  '--colors-grayA7': 'hsl(0 0% 0% / 0.141)',
+  '--colors-grayA8': 'hsl(0 0% 0% / 0.22)',
+  '--colors-grayA9': 'hsl(0 0% 0% / 0.439)',
+  '--colors-grayA10': 'hsl(0 0% 0% / 0.478)',
+  '--colors-grayA11': 'hsl(0 0% 0% / 0.565)',
+  '--colors-grayA12': 'hsl(0 0% 0% / 0.91)',
+  '--colors-mauveA1': 'hsl(300 89.3% 18.3% / 0.012)',
+  '--colors-mauveA2': 'hsl(300 78.1% 9% / 0.028)',
+  '--colors-mauveA3': 'hsl(300 99.5% 7.7% / 0.051)',
+  '--colors-mauveA4': 'hsl(270 90.5% 6.1% / 0.071)',
+  '--colors-mauveA5': 'hsl(270 83% 5.2% / 0.091)',
+  '--colors-mauveA6': 'hsl(300 93.5% 3.7% / 0.114)',
+  '--colors-mauveA7': 'hsl(270 82.6% 3.3% / 0.142)',
+  '--colors-mauveA8': 'hsl(255 95.2% 3.7% / 0.22)',
+  '--colors-mauveA9': 'hsl(255 94.8% 3.7% / 0.444)',
+  '--colors-mauveA10': 'hsl(253 96.5% 3.8% / 0.483)',
+  '--colors-mauveA11': 'hsl(247 97.9% 3.2% / 0.569)',
+  '--colors-mauveA12': 'hsl(261 98.7% 3% / 0.918)',
+  '--colors-slateA1': 'hsl(210 92.6% 26.5% / 0.016)',
+  '--colors-slateA2': 'hsl(210 87.7% 16% / 0.028)',
+  '--colors-slateA3': 'hsl(210 98.8% 14.4% / 0.055)',
+  '--colors-slateA4': 'hsl(210 94.1% 11.1% / 0.075)',
+  '--colors-slateA5': 'hsl(216 91.1% 10.9% / 0.099)',
+  '--colors-slateA6': 'hsl(206 96.4% 11.3% / 0.126)',
+  '--colors-slateA7': 'hsl(210 99.1% 10.1% / 0.157)',
+  '--colors-slateA8': 'hsl(205 96.5% 10% / 0.244)',
+  '--colors-slateA9': 'hsl(206 98.8% 5.9% / 0.467)',
+  '--colors-slateA10': 'hsl(206 99.6% 5.4% / 0.506)',
+  '--colors-slateA11': 'hsl(206 97% 4.8% / 0.593)',
+  '--colors-slateA12': 'hsl(202 97% 2.4% / 0.934)',
+  '--colors-sageA1': 'hsl(150 92.6% 26.5% / 0.016)',
+  '--colors-sageA2': 'hsl(150 87.7% 16% / 0.028)',
+  '--colors-sageA3': 'hsl(160 98.4% 10.9% / 0.055)',
+  '--colors-sageA4': 'hsl(140 92.3% 8.5% / 0.075)',
+  '--colors-sageA5': 'hsl(160 86% 6.9% / 0.099)',
+  '--colors-sageA6': 'hsl(156 95.1% 8.2% / 0.126)',
+  '--colors-sageA7': 'hsl(156 98.6% 6.3% / 0.157)',
+  '--colors-sageA8': 'hsl(154 94.6% 6% / 0.24)',
+  '--colors-sageA9': 'hsl(154 98.7% 3% / 0.459)',
+  '--colors-sageA10': 'hsl(154 93.5% 2.9% / 0.499)',
+  '--colors-sageA11': 'hsl(154 95.2% 2.5% / 0.585)',
+  '--colors-sageA12': 'hsl(158 97% 2.4% / 0.934)',
+  '--colors-oliveA1': 'hsl(120 89.3% 18.3% / 0.012)',
+  '--colors-oliveA2': 'hsl(120 87.7% 16% / 0.028)',
+  '--colors-oliveA3': 'hsl(120 99.5% 7.7% / 0.051)',
+  '--colors-oliveA4': 'hsl(120 92.3% 8.5% / 0.075)',
+  '--colors-oliveA5': 'hsl(120 86% 6.9% / 0.099)',
+  '--colors-oliveA6': 'hsl(120 94.8% 6.8% / 0.122)',
+  '--colors-oliveA7': 'hsl(120 99.3% 5.2% / 0.153)',
+  '--colors-oliveA8': 'hsl(110 93.8% 5.2% / 0.24)',
+  '--colors-oliveA9': 'hsl(111 98.7% 3% / 0.459)',
+  '--colors-oliveA10': 'hsl(111 93.5% 2.9% / 0.499)',
+  '--colors-oliveA11': 'hsl(111 95.2% 2.5% / 0.585)',
+  '--colors-oliveA12': 'hsl(110 97.6% 2.6% / 0.93)',
+  '--colors-sandA1': 'hsl(60 89.3% 18.3% / 0.012)',
+  '--colors-sandA2': 'hsl(60 78.1% 9% / 0.028)',
+  '--colors-sandA3': 'hsl(60 99% 3.9% / 0.051)',
+  '--colors-sandA4': 'hsl(60 88.9% 5.9% / 0.075)',
+  '--colors-sandA5': 'hsl(60 86% 6.9% / 0.099)',
+  '--colors-sandA6': 'hsl(60 93.2% 5.2% / 0.122)',
+  '--colors-sandA7': 'hsl(60 98.3% 5.1% / 0.157)',
+  '--colors-sandA8': 'hsl(51 94.1% 6% / 0.244)',
+  '--colors-sandA9': 'hsl(60 99.8% 1.7% / 0.451)',
+  '--colors-sandA10': 'hsl(60 90.7% 1.8% / 0.491)',
+  '--colors-sandA11': 'hsl(45 93.7% 1.5% / 0.577)',
+  '--colors-sandA12': 'hsl(60 98% 0.7% / 0.906)',
+  '--colors-tomatoA1': 'hsl(0 100% 51% / 0.012)',
+  '--colors-tomatoA2': 'hsl(8 100% 51% / 0.032)',
+  '--colors-tomatoA3': 'hsl(7 100% 50.2% / 0.067)',
+  '--colors-tomatoA4': 'hsl(8 100% 50.1% / 0.114)',
+  '--colors-tomatoA5': 'hsl(7 99.5% 47.9% / 0.173)',
+  '--colors-tomatoA6': 'hsl(9 99.9% 46.2% / 0.255)',
+  '--colors-tomatoA7': 'hsl(10 99.8% 43.6% / 0.365)',
+  '--colors-tomatoA8': 'hsl(10 99.5% 41.8% / 0.499)',
+  '--colors-tomatoA9': 'hsl(10 99.9% 43.8% / 0.82)',
+  '--colors-tomatoA10': 'hsl(10 100% 41.8% / 0.859)',
+  '--colors-tomatoA11': 'hsl(10 99.9% 38.8% / 0.922)',
+  '--colors-tomatoA12': 'hsl(10 99% 7.4% / 0.934)',
+  '--colors-redA1': 'hsl(0 100% 51% / 0.012)',
+  '--colors-redA2': 'hsl(0 100% 51% / 0.032)',
+  '--colors-redA3': 'hsl(0 100% 50.2% / 0.063)',
+  '--colors-redA4': 'hsl(0 100% 50% / 0.102)',
+  '--colors-redA5': 'hsl(0 99.9% 47.5% / 0.153)',
+  '--colors-redA6': 'hsl(0 99.5% 44.9% / 0.224)',
+  '--colors-redA7': 'hsl(359 99.7% 42.7% / 0.318)',
+  '--colors-redA8': 'hsl(359 99.6% 41.1% / 0.436)',
+  '--colors-redA9': 'hsl(358 99.9% 42.9% / 0.718)',
+  '--colors-redA10': 'hsl(358 99.9% 41% / 0.761)',
+  '--colors-redA11': 'hsl(358 99.8% 38.3% / 0.832)',
+  '--colors-redA12': 'hsl(355 99.3% 7.9% / 0.926)',
+  '--colors-crimsonA1': 'hsl(340 100% 51% / 0.012)',
+  '--colors-crimsonA2': 'hsl(330 100% 51% / 0.032)',
+  '--colors-crimsonA3': 'hsl(332 99.1% 47.1% / 0.063)',
+  '--colors-crimsonA4': 'hsl(331 99.9% 44.3% / 0.102)',
+  '--colors-crimsonA5': 'hsl(333 99.9% 42.3% / 0.153)',
+  '--colors-crimsonA6': 'hsl(333 99.5% 40.5% / 0.224)',
+  '--colors-crimsonA7': 'hsl(335 99.7% 39.1% / 0.322)',
+  '--colors-crimsonA8': 'hsl(336 99.5% 38.5% / 0.44)',
+  '--colors-crimsonA9': 'hsl(336 99.9% 44.3% / 0.761)',
+  '--colors-crimsonA10': 'hsl(336 100% 42.5% / 0.808)',
+  '--colors-crimsonA11': 'hsl(336 99.8% 40.3% / 0.883)',
+  '--colors-crimsonA12': 'hsl(340 99% 10% / 0.95)',
+  '--colors-pinkA1': 'hsl(320 100% 51% / 0.012)',
+  '--colors-pinkA2': 'hsl(323 100% 51% / 0.032)',
+  '--colors-pinkA3': 'hsl(323 98.9% 47.3% / 0.067)',
+  '--colors-pinkA4': 'hsl(323 99.9% 44.3% / 0.102)',
+  '--colors-pinkA5': 'hsl(324 99.9% 42.3% / 0.153)',
+  '--colors-pinkA6': 'hsl(323 99.5% 39.6% / 0.224)',
+  '--colors-pinkA7': 'hsl(323 99.7% 38.5% / 0.322)',
+  '--colors-pinkA8': 'hsl(323 99.5% 37.7% / 0.444)',
+  '--colors-pinkA9': 'hsl(322 99.7% 39.3% / 0.75)',
+  '--colors-pinkA10': 'hsl(322 100% 39.1% / 0.808)',
+  '--colors-pinkA11': 'hsl(322 99.8% 39% / 0.887)',
+  '--colors-pinkA12': 'hsl(321 99.8% 10% / 0.961)',
+  '--colors-plumA1': 'hsl(280 100% 51% / 0.012)',
+  '--colors-plumA2': 'hsl(300 100% 51% / 0.028)',
+  '--colors-plumA3': 'hsl(300 99% 40.9% / 0.063)',
+  '--colors-plumA4': 'hsl(300 99.9% 38.5% / 0.102)',
+  '--colors-plumA5': 'hsl(298 98.2% 35.9% / 0.15)',
+  '--colors-plumA6': 'hsl(297 99.6% 33.7% / 0.216)',
+  '--colors-plumA7': 'hsl(295 99.7% 32.6% / 0.314)',
+  '--colors-plumA8': 'hsl(292 99.6% 32.4% / 0.432)',
+  '--colors-plumA9': 'hsl(292 99.9% 31% / 0.71)',
+  '--colors-plumA10': 'hsl(292 99.9% 30.8% / 0.765)',
+  '--colors-plumA11': 'hsl(292 99.8% 30.7% / 0.832)',
+  '--colors-plumA12': 'hsl(291 99.9% 9.7% / 0.953)',
+  '--colors-purpleA1': 'hsl(300 94.3% 34.6% / 0.012)',
+  '--colors-purpleA2': 'hsl(276 100% 51% / 0.02)',
+  '--colors-purpleA3': 'hsl(277 99.6% 46.5% / 0.055)',
+  '--colors-purpleA4': 'hsl(274 97.9% 44.3% / 0.095)',
+  '--colors-purpleA5': 'hsl(276 98.6% 42% / 0.142)',
+  '--colors-purpleA6': 'hsl(275 100% 39.2% / 0.2)',
+  '--colors-purpleA7': 'hsl(273 99.2% 38.2% / 0.295)',
+  '--colors-purpleA8': 'hsl(272 99.7% 37.6% / 0.424)',
+  '--colors-purpleA9': 'hsl(272 99.6% 34% / 0.695)',
+  '--colors-purpleA10': 'hsl(272 99.7% 32% / 0.73)',
+  '--colors-purpleA11': 'hsl(272 99.8% 29.7% / 0.773)',
+  '--colors-purpleA12': 'hsl(272 99.2% 11.3% / 0.946)',
+  '--colors-violetA1': 'hsl(270 94.3% 34.6% / 0.012)',
+  '--colors-violetA2': 'hsl(252 100% 51% / 0.02)',
+  '--colors-violetA3': 'hsl(254 100% 50% / 0.051)',
+  '--colors-violetA4': 'hsl(251 98.3% 48.2% / 0.087)',
+  '--colors-violetA5': 'hsl(252 99% 45.7% / 0.13)',
+  '--colors-violetA6': 'hsl(251 99.1% 44% / 0.189)',
+  '--colors-violetA7': 'hsl(252 99.5% 41.7% / 0.279)',
+  '--colors-violetA8': 'hsl(252 100% 40.7% / 0.4)',
+  '--colors-violetA9': 'hsl(252 99.9% 35.8% / 0.663)',
+  '--colors-violetA10': 'hsl(251 99.6% 32.5% / 0.691)',
+  '--colors-violetA11': 'hsl(250 99.8% 28.4% / 0.726)',
+  '--colors-violetA12': 'hsl(254 99.5% 11.9% / 0.926)',
+  '--colors-indigoA1': 'hsl(240 92.6% 26.5% / 0.008)',
+  '--colors-indigoA2': 'hsl(223 100% 51% / 0.028)',
+  '--colors-indigoA3': 'hsl(224 100% 50.1% / 0.059)',
+  '--colors-indigoA4': 'hsl(223 98% 48.5% / 0.099)',
+  '--colors-indigoA5': 'hsl(225 98.6% 46.4% / 0.15)',
+  '--colors-indigoA6': 'hsl(224 99.5% 44.9% / 0.224)',
+  '--colors-indigoA7': 'hsl(225 99.7% 43.9% / 0.318)',
+  '--colors-indigoA8': 'hsl(226 99.5% 43.1% / 0.448)',
+  '--colors-indigoA9': 'hsl(226 100% 41.2% / 0.757)',
+  '--colors-indigoA10': 'hsl(226 99.8% 37.1% / 0.773)',
+  '--colors-indigoA11': 'hsl(226 99.6% 31.1% / 0.797)',
+  '--colors-indigoA12': 'hsl(226 99.3% 11.4% / 0.938)',
+  '--colors-blueA1': 'hsl(210 100% 51% / 0.016)',
+  '--colors-blueA2': 'hsl(210 100% 51% / 0.04)',
+  '--colors-blueA3': 'hsl(210 100% 50.3% / 0.071)',
+  '--colors-blueA4': 'hsl(210 100% 50.1% / 0.118)',
+  '--colors-blueA5': 'hsl(208 99.1% 47.1% / 0.189)',
+  '--colors-blueA6': 'hsl(209 99.5% 45.3% / 0.283)',
+  '--colors-blueA7': 'hsl(208 99.9% 43.8% / 0.412)',
+  '--colors-blueA8': 'hsl(206 99.8% 45.1% / 0.632)',
+  '--colors-blueA9': 'hsl(206 100% 50% / 0.98)',
+  '--colors-blueA10': 'hsl(208 100% 47.2% / 0.98)',
+  '--colors-blueA11': 'hsl(212 100% 43% / 0.98)',
+  '--colors-blueA12': 'hsl(213 100% 14.4% / 0.98)',
+  '--colors-skyA1': 'hsl(190 100% 51% / 0.024)',
+  '--colors-skyA2': 'hsl(193 100% 50.1% / 0.055)',
+  '--colors-skyA3': 'hsl(193 100% 50.1% / 0.106)',
+  '--colors-skyA4': 'hsl(194 99.6% 47.7% / 0.165)',
+  '--colors-skyA5': 'hsl(194 99.2% 45.4% / 0.244)',
+  '--colors-skyA6': 'hsl(194 99.9% 42.3% / 0.357)',
+  '--colors-skyA7': 'hsl(194 99.8% 42.2% / 0.526)',
+  '--colors-skyA8': 'hsl(193 99.9% 43.8% / 0.82)',
+  '--colors-skyA9': 'hsl(193 99.7% 49.4% / 0.593)',
+  '--colors-skyA10': 'hsl(193 99.8% 46.6% / 0.628)',
+  '--colors-skyA11': 'hsl(196 100% 31.2% / 0.98)',
+  '--colors-skyA12': 'hsl(196 100% 12.2% / 0.98)',
+  '--colors-mintA1': 'hsl(168 95.4% 42.8% / 0.024)',
+  '--colors-mintA2': 'hsl(164 99.1% 47.1% / 0.063)',
+  '--colors-mintA3': 'hsl(164 99.3% 43.5% / 0.118)',
+  '--colors-mintA4': 'hsl(164 99.3% 41.3% / 0.177)',
+  '--colors-mintA5': 'hsl(165 99% 37.5% / 0.248)',
+  '--colors-mintA6': 'hsl(165 100% 35% / 0.353)',
+  '--colors-mintA7': 'hsl(166 99.9% 33.5% / 0.51)',
+  '--colors-mintA8': 'hsl(168 99.6% 34.6% / 0.75)',
+  '--colors-mintA9': 'hsl(167 99.9% 39.5% / 0.561)',
+  '--colors-mintA10': 'hsl(167 99.7% 37.4% / 0.589)',
+  '--colors-mintA11': 'hsl(172 99.8% 22.4% / 0.922)',
+  '--colors-mintA12': 'hsl(172 99.7% 8.8% / 0.965)',
+  '--colors-cyanA1': 'hsl(195 95.2% 41.2% / 0.02)',
+  '--colors-cyanA2': 'hsl(185 99.9% 42.3% / 0.051)',
+  '--colors-cyanA3': 'hsl(186 97.8% 42.2% / 0.095)',
+  '--colors-cyanA4': 'hsl(186 99.9% 38.5% / 0.153)',
+  '--colors-cyanA5': 'hsl(187 99.3% 36.6% / 0.232)',
+  '--colors-cyanA6': 'hsl(188 99.4% 35.4% / 0.334)',
+  '--colors-cyanA7': 'hsl(189 99.6% 35% / 0.483)',
+  '--colors-cyanA8': 'hsl(189 99.9% 37.6% / 0.761)',
+  '--colors-cyanA9': 'hsl(190 100% 37.8% / 0.98)',
+  '--colors-cyanA10': 'hsl(191 99.9% 34.6% / 0.969)',
+  '--colors-cyanA11': 'hsl(192 100% 27.6% / 0.953)',
+  '--colors-cyanA12': 'hsl(192 100% 11% / 0.98)',
+  '--colors-tealA1': 'hsl(165 95.2% 41.2% / 0.02)',
+  '--colors-tealA2': 'hsl(169 99.5% 39.4% / 0.055)',
+  '--colors-tealA3': 'hsl(167 97.6% 38.1% / 0.095)',
+  '--colors-tealA4': 'hsl(168 98.1% 34.6% / 0.15)',
+  '--colors-tealA5': 'hsl(170 99.4% 32.3% / 0.22)',
+  '--colors-tealA6': 'hsl(170 99.7% 30.1% / 0.314)',
+  '--colors-tealA7': 'hsl(170 99.3% 28.7% / 0.448)',
+  '--colors-tealA8': 'hsl(172 99.8% 29.7% / 0.675)',
+  '--colors-tealA9': 'hsl(173 99.8% 31.1% / 0.93)',
+  '--colors-tealA10': 'hsl(173 99.7% 28.7% / 0.946)',
+  '--colors-tealA11': 'hsl(174 99.8% 23.3% / 0.977)',
+  '--colors-tealA12': 'hsl(171 98.8% 6.8% / 0.938)',
+  '--colors-greenA1': 'hsl(140 94.9% 38.7% / 0.016)',
+  '--colors-greenA2': 'hsl(138 99.9% 38.5% / 0.051)',
+  '--colors-greenA3': 'hsl(139 97.7% 36.9% / 0.087)',
+  '--colors-greenA4': 'hsl(139 98.5% 32.7% / 0.134)',
+  '--colors-greenA5': 'hsl(141 100% 30.4% / 0.2)',
+  '--colors-greenA6': 'hsl(142 99% 28.9% / 0.295)',
+  '--colors-greenA7': 'hsl(146 99.5% 27.6% / 0.428)',
+  '--colors-greenA8': 'hsl(151 99.5% 28.8% / 0.644)',
+  '--colors-greenA9': 'hsl(151 99.9% 28% / 0.812)',
+  '--colors-greenA10': 'hsl(152 99.6% 25.8% / 0.84)',
+  '--colors-greenA11': 'hsl(153 99.9% 21% / 0.906)',
+  '--colors-greenA12': 'hsl(155 99.4% 6.2% / 0.918)',
+  '--colors-grassA1': 'hsl(120 94.9% 38.7% / 0.016)',
+  '--colors-grassA2': 'hsl(120 94.9% 38.7% / 0.048)',
+  '--colors-grassA3': 'hsl(120 98% 35.5% / 0.079)',
+  '--colors-grassA4': 'hsl(120 98.7% 31.5% / 0.126)',
+  '--colors-grassA5': 'hsl(122 98.5% 29.9% / 0.193)',
+  '--colors-grassA6': 'hsl(125 99.2% 27.9% / 0.283)',
+  '--colors-grassA7': 'hsl(125 99.9% 27% / 0.408)',
+  '--colors-grassA8': 'hsl(131 100% 27.6% / 0.604)',
+  '--colors-grassA9': 'hsl(131 99.7% 26.3% / 0.726)',
+  '--colors-grassA10': 'hsl(132 99.9% 24% / 0.761)',
+  '--colors-grassA11': 'hsl(133 99.5% 19.5% / 0.84)',
+  '--colors-grassA12': 'hsl(128 98% 4.9% / 0.895)',
+  '--colors-limeA1': 'hsl(80 93.8% 31.4% / 0.02)',
+  '--colors-limeA2': 'hsl(85 99.3% 40.2% / 0.059)',
+  '--colors-limeA3': 'hsl(84 98.7% 43.2% / 0.138)',
+  '--colors-limeA4': 'hsl(84 99.6% 43% / 0.22)',
+  '--colors-limeA5': 'hsl(85 99.8% 41.8% / 0.31)',
+  '--colors-limeA6': 'hsl(82 99.8% 39.3% / 0.42)',
+  '--colors-limeA7': 'hsl(79 99.7% 34.6% / 0.585)',
+  '--colors-limeA8': 'hsl(76 99.8% 33.7% / 0.828)',
+  '--colors-limeA9': 'hsl(81 99.8% 40.2% / 0.836)',
+  '--colors-limeA10': 'hsl(80 100% 37.6% / 0.851)',
+  '--colors-limeA11': 'hsl(75 99.5% 22% / 0.95)',
+  '--colors-limeA12': 'hsl(78 99.6% 8.4% / 0.965)',
+  '--colors-yellowA1': 'hsl(60 94.3% 34.6% / 0.024)',
+  '--colors-yellowA2': 'hsl(52 100% 50.4% / 0.091)',
+  '--colors-yellowA3': 'hsl(55 100% 50.2% / 0.181)',
+  '--colors-yellowA4': 'hsl(54 100% 50.1% / 0.267)',
+  '--colors-yellowA5': 'hsl(52 99.9% 49.5% / 0.357)',
+  '--colors-yellowA6': 'hsl(50 100% 47.4% / 0.451)',
+  '--colors-yellowA7': 'hsl(47 99.8% 44.6% / 0.577)',
+  '--colors-yellowA8': 'hsl(48 100% 46% / 0.98)',
+  '--colors-yellowA9': 'hsl(53 100% 48% / 0.961)',
+  '--colors-yellowA10': 'hsl(50 100% 48.4% / 0.98)',
+  '--colors-yellowA11': 'hsl(42 100% 28.6% / 0.98)',
+  '--colors-yellowA12': 'hsl(41 98.9% 8% / 0.942)',
+  '--colors-amberA1': 'hsl(40 94.9% 38.7% / 0.016)',
+  '--colors-amberA2': 'hsl(40 100% 50.3% / 0.071)',
+  '--colors-amberA3': 'hsl(44 100% 50.1% / 0.165)',
+  '--colors-amberA4': 'hsl(43 100% 50% / 0.263)',
+  '--colors-amberA5': 'hsl(42 100% 50% / 0.365)',
+  '--colors-amberA6': 'hsl(38 100% 50.1% / 0.475)',
+  '--colors-amberA7': 'hsl(36 99.9% 46.2% / 0.612)',
+  '--colors-amberA8': 'hsl(35 99.8% 46% / 0.832)',
+  '--colors-amberA9': 'hsl(39 100% 50% / 0.859)',
+  '--colors-amberA10': 'hsl(35 100% 50% / 0.891)',
+  '--colors-amberA11': 'hsl(29 100% 33.6% / 0.98)',
+  '--colors-amberA12': 'hsl(20 99.8% 14.1% / 0.965)',
+  '--colors-orangeA1': 'hsl(20 94.9% 38.7% / 0.016)',
+  '--colors-orangeA2': 'hsl(24 95.8% 46.5% / 0.044)',
+  '--colors-orangeA3': 'hsl(25 100% 50.5% / 0.095)',
+  '--colors-orangeA4': 'hsl(26 100% 50% / 0.157)',
+  '--colors-orangeA5': 'hsl(25 100% 50.1% / 0.236)',
+  '--colors-orangeA6': 'hsl(25 100% 50.1% / 0.346)',
+  '--colors-orangeA7': 'hsl(24 100% 50.1% / 0.495)',
+  '--colors-orangeA8': 'hsl(24 99.7% 48.7% / 0.695)',
+  '--colors-orangeA9': 'hsl(24 99.9% 48.4% / 0.969)',
+  '--colors-orangeA10': 'hsl(23 100% 46.4% / 0.98)',
+  '--colors-orangeA11': 'hsl(23 100% 36.8% / 0.98)',
+  '--colors-orangeA12': 'hsl(15 99.4% 11% / 0.934)',
+  '--colors-brownA1': 'hsl(30 94.3% 34.6% / 0.012)',
+  '--colors-brownA2': 'hsl(30 94.3% 34.6% / 0.036)',
+  '--colors-brownA3': 'hsl(30 97.7% 33.9% / 0.083)',
+  '--colors-brownA4': 'hsl(31 98.5% 34.2% / 0.134)',
+  '--colors-brownA5': 'hsl(29 100% 34.3% / 0.2)',
+  '--colors-brownA6': 'hsl(28 99.2% 34.6% / 0.291)',
+  '--colors-brownA7': 'hsl(29 99.8% 33.8% / 0.412)',
+  '--colors-brownA8': 'hsl(28 100% 33.3% / 0.553)',
+  '--colors-brownA9': 'hsl(28 99.9% 25.5% / 0.655)',
+  '--colors-brownA10': 'hsl(27 99.7% 22.4% / 0.675)',
+  '--colors-brownA11': 'hsl(25 99.8% 17.3% / 0.714)',
+  '--colors-brownA12': 'hsl(21 99.4% 6.6% / 0.867)',
+  '--colors-bronzeA1': 'hsl(0 89.3% 18.3% / 0.012)',
+  '--colors-bronzeA2': 'hsl(17 95.1% 40.1% / 0.036)',
+  '--colors-bronzeA3': 'hsl(18 98.3% 29.8% / 0.067)',
+  '--colors-bronzeA4': 'hsl(17 99.6% 26% / 0.106)',
+  '--colors-bronzeA5': 'hsl(19 99.6% 23.8% / 0.157)',
+  '--colors-bronzeA6': 'hsl(17 99.2% 22.5% / 0.22)',
+  '--colors-bronzeA7': 'hsl(18 99.7% 21.6% / 0.31)',
+  '--colors-bronzeA8': 'hsl(17 99.5% 20.2% / 0.42)',
+  '--colors-bronzeA9': 'hsl(18 99.9% 16.7% / 0.553)',
+  '--colors-bronzeA10': 'hsl(17 99.2% 15.4% / 0.589)',
+  '--colors-bronzeA11': 'hsl(15 99.9% 13.2% / 0.655)',
+  '--colors-bronzeA12': 'hsl(12 98.7% 5.7% / 0.832)',
+  '--colors-goldA1': 'hsl(60 89.3% 18.3% / 0.012)',
+  '--colors-goldA2': 'hsl(47 99.9% 34.6% / 0.051)',
+  '--colors-goldA3': 'hsl(45 97% 27.9% / 0.087)',
+  '--colors-goldA4': 'hsl(46 98% 25.4% / 0.134)',
+  '--colors-goldA5': 'hsl(43 98.4% 22.6% / 0.185)',
+  '--colors-goldA6': 'hsl(41 99.7% 22% / 0.259)',
+  '--colors-goldA7': 'hsl(38 99.8% 21.5% / 0.357)',
+  '--colors-goldA8': 'hsl(36 99.3% 21.5% / 0.487)',
+  '--colors-goldA9': 'hsl(36 99.9% 16.2% / 0.604)',
+  '--colors-goldA10': 'hsl(36 99.2% 14.6% / 0.636)',
+  '--colors-goldA11': 'hsl(35 99.1% 11.2% / 0.687)',
+  '--colors-goldA12': 'hsl(38 98% 3.8% / 0.832)',
+}
+
+export const radix_dark = {
+  '--colors-gray1': 'hsl(0 0% 8.5%)',
+  '--colors-gray2': 'hsl(0 0% 11%)',
+  '--colors-gray3': 'hsl(0 0% 13.6%)',
+  '--colors-gray4': 'hsl(0 0% 15.8%)',
+  '--colors-gray5': 'hsl(0 0% 17.9%)',
+  '--colors-gray6': 'hsl(0 0% 20.5%)',
+  '--colors-gray7': 'hsl(0 0% 24.3%)',
+  '--colors-gray8': 'hsl(0 0% 31.2%)',
+  '--colors-gray9': 'hsl(0 0% 43.9%)',
+  '--colors-gray10': 'hsl(0 0% 49.4%)',
+  '--colors-gray11': 'hsl(0 0% 62.8%)',
+  '--colors-gray12': 'hsl(0 0% 93%)',
+  '--colors-mauve1': 'hsl(246 6% 9%)',
+  '--colors-mauve2': 'hsl(240 5.1% 11.6%)',
+  '--colors-mauve3': 'hsl(241 5% 14.3%)',
+  '--colors-mauve4': 'hsl(242 4.9% 16.5%)',
+  '--colors-mauve5': 'hsl(243 4.9% 18.8%)',
+  '--colors-mauve6': 'hsl(244 4.9% 21.5%)',
+  '--colors-mauve7': 'hsl(245 4.9% 25.4%)',
+  '--colors-mauve8': 'hsl(247 4.8% 32.5%)',
+  '--colors-mauve9': 'hsl(252 4% 45.2%)',
+  '--colors-mauve10': 'hsl(247 3.4% 50.7%)',
+  '--colors-mauve11': 'hsl(253 4% 63.7%)',
+  '--colors-mauve12': 'hsl(256 6% 93.2%)',
+  '--colors-slate1': 'hsl(200 7% 8.8%)',
+  '--colors-slate2': 'hsl(195 7.1% 11%)',
+  '--colors-slate3': 'hsl(197 6.8% 13.6%)',
+  '--colors-slate4': 'hsl(198 6.6% 15.8%)',
+  '--colors-slate5': 'hsl(199 6.4% 17.9%)',
+  '--colors-slate6': 'hsl(201 6.2% 20.5%)',
+  '--colors-slate7': 'hsl(203 6% 24.3%)',
+  '--colors-slate8': 'hsl(207 5.6% 31.6%)',
+  '--colors-slate9': 'hsl(206 6% 43.9%)',
+  '--colors-slate10': 'hsl(206 5.2% 49.5%)',
+  '--colors-slate11': 'hsl(206 6% 63%)',
+  '--colors-slate12': 'hsl(210 6% 93%)',
+  '--colors-sage1': 'hsl(155 7% 8.4%)',
+  '--colors-sage2': 'hsl(150 7.4% 10.6%)',
+  '--colors-sage3': 'hsl(150 6.7% 13.1%)',
+  '--colors-sage4': 'hsl(150 6.4% 15.3%)',
+  '--colors-sage5': 'hsl(150 6.1% 17.4%)',
+  '--colors-sage6': 'hsl(150 5.8% 19.9%)',
+  '--colors-sage7': 'hsl(150 5.5% 23.6%)',
+  '--colors-sage8': 'hsl(150 5.1% 30.6%)',
+  '--colors-sage9': 'hsl(155 6% 42.5%)',
+  '--colors-sage10': 'hsl(153 4.8% 48.2%)',
+  '--colors-sage11': 'hsl(155 5% 61.8%)',
+  '--colors-sage12': 'hsl(155 6% 93%)',
+  '--colors-olive1': 'hsl(110 5% 8.6%)',
+  '--colors-olive2': 'hsl(105 7.4% 10.6%)',
+  '--colors-olive3': 'hsl(106 6.4% 13.1%)',
+  '--colors-olive4': 'hsl(106 5.8% 15.3%)',
+  '--colors-olive5': 'hsl(107 5.3% 17.4%)',
+  '--colors-olive6': 'hsl(107 4.9% 19.9%)',
+  '--colors-olive7': 'hsl(108 4.4% 23.6%)',
+  '--colors-olive8': 'hsl(110 3.8% 30.6%)',
+  '--colors-olive9': 'hsl(110 6% 42.5%)',
+  '--colors-olive10': 'hsl(111 4.8% 48.2%)',
+  '--colors-olive11': 'hsl(110 5% 61.8%)',
+  '--colors-olive12': 'hsl(110 6% 93%)',
+  '--colors-sand1': 'hsl(61 2% 8.3%)',
+  '--colors-sand2': 'hsl(60 3.7% 10.6%)',
+  '--colors-sand3': 'hsl(58 3.7% 13.1%)',
+  '--colors-sand4': 'hsl(57 3.6% 15.3%)',
+  '--colors-sand5': 'hsl(56 3.7% 17.4%)',
+  '--colors-sand6': 'hsl(55 3.7% 19.9%)',
+  '--colors-sand7': 'hsl(53 3.7% 23.6%)',
+  '--colors-sand8': 'hsl(50 3.8% 30.6%)',
+  '--colors-sand9': 'hsl(50 4% 42.7%)',
+  '--colors-sand10': 'hsl(52 3.1% 48.3%)',
+  '--colors-sand11': 'hsl(50 4% 61.8%)',
+  '--colors-sand12': 'hsl(56 4% 92.8%)',
+  '--colors-tomato1': 'hsl(10 23% 9.4%)',
+  '--colors-tomato2': 'hsl(9 44.8% 11.4%)',
+  '--colors-tomato3': 'hsl(8 52% 15.3%)',
+  '--colors-tomato4': 'hsl(7 56.3% 18%)',
+  '--colors-tomato5': 'hsl(7 60.1% 20.6%)',
+  '--colors-tomato6': 'hsl(8 64.8% 24%)',
+  '--colors-tomato7': 'hsl(8 71.2% 29.1%)',
+  '--colors-tomato8': 'hsl(10 80.2% 35.7%)',
+  '--colors-tomato9': 'hsl(10 78% 54%)',
+  '--colors-tomato10': 'hsl(10 81.7% 59%)',
+  '--colors-tomato11': 'hsl(10 85% 62.8%)',
+  '--colors-tomato12': 'hsl(10 89% 96%)',
+  '--colors-red1': 'hsl(353 23% 9.8%)',
+  '--colors-red2': 'hsl(357 34.4% 12%)',
+  '--colors-red3': 'hsl(356 43.4% 16.4%)',
+  '--colors-red4': 'hsl(356 47.6% 19.2%)',
+  '--colors-red5': 'hsl(356 51.1% 21.9%)',
+  '--colors-red6': 'hsl(356 55.2% 25.9%)',
+  '--colors-red7': 'hsl(357 60.2% 31.8%)',
+  '--colors-red8': 'hsl(358 65% 40.4%)',
+  '--colors-red9': 'hsl(358 75% 59%)',
+  '--colors-red10': 'hsl(358 85.3% 64%)',
+  '--colors-red11': 'hsl(358 100% 69.5%)',
+  '--colors-red12': 'hsl(351 89% 96%)',
+  '--colors-crimson1': 'hsl(335 20% 9.6%)',
+  '--colors-crimson2': 'hsl(335 32.2% 11.6%)',
+  '--colors-crimson3': 'hsl(335 42.5% 16.5%)',
+  '--colors-crimson4': 'hsl(335 47.2% 19.3%)',
+  '--colors-crimson5': 'hsl(335 50.9% 21.8%)',
+  '--colors-crimson6': 'hsl(335 55.7% 25.3%)',
+  '--colors-crimson7': 'hsl(336 62.9% 30.8%)',
+  '--colors-crimson8': 'hsl(336 74.9% 39%)',
+  '--colors-crimson9': 'hsl(336 80% 57.8%)',
+  '--colors-crimson10': 'hsl(339 84.1% 62.6%)',
+  '--colors-crimson11': 'hsl(341 90% 67.3%)',
+  '--colors-crimson12': 'hsl(332 87% 96%)',
+  '--colors-pink1': 'hsl(318 25% 9.6%)',
+  '--colors-pink2': 'hsl(319 32.2% 11.6%)',
+  '--colors-pink3': 'hsl(319 41% 16%)',
+  '--colors-pink4': 'hsl(320 45.4% 18.7%)',
+  '--colors-pink5': 'hsl(320 49% 21.1%)',
+  '--colors-pink6': 'hsl(321 53.6% 24.4%)',
+  '--colors-pink7': 'hsl(321 61.1% 29.7%)',
+  '--colors-pink8': 'hsl(322 74.9% 37.5%)',
+  '--colors-pink9': 'hsl(322 65% 54.5%)',
+  '--colors-pink10': 'hsl(323 72.8% 59.2%)',
+  '--colors-pink11': 'hsl(325 90% 66.4%)',
+  '--colors-pink12': 'hsl(322 90% 95.8%)',
+  '--colors-plum1': 'hsl(301 20% 9.4%)',
+  '--colors-plum2': 'hsl(300 29.8% 11.2%)',
+  '--colors-plum3': 'hsl(298 34.4% 15.3%)',
+  '--colors-plum4': 'hsl(297 36.8% 18.3%)',
+  '--colors-plum5': 'hsl(296 38.5% 21.1%)',
+  '--colors-plum6': 'hsl(295 40.4% 24.7%)',
+  '--colors-plum7': 'hsl(294 42.7% 30.6%)',
+  '--colors-plum8': 'hsl(292 45.1% 40%)',
+  '--colors-plum9': 'hsl(292 45% 51%)',
+  '--colors-plum10': 'hsl(295 50% 55.4%)',
+  '--colors-plum11': 'hsl(300 60% 62%)',
+  '--colors-plum12': 'hsl(296 74% 95.7%)',
+  '--colors-purple1': 'hsl(284 20% 9.6%)',
+  '--colors-purple2': 'hsl(283 30% 11.8%)',
+  '--colors-purple3': 'hsl(281 37.5% 16.5%)',
+  '--colors-purple4': 'hsl(280 41.2% 20%)',
+  '--colors-purple5': 'hsl(279 43.8% 23.3%)',
+  '--colors-purple6': 'hsl(277 46.4% 27.5%)',
+  '--colors-purple7': 'hsl(275 49.3% 34.6%)',
+  '--colors-purple8': 'hsl(272 52.1% 45.9%)',
+  '--colors-purple9': 'hsl(272 51% 54%)',
+  '--colors-purple10': 'hsl(273 57.3% 59.1%)',
+  '--colors-purple11': 'hsl(275 80% 71%)',
+  '--colors-purple12': 'hsl(279 75% 95.7%)',
+  '--colors-violet1': 'hsl(250 20% 10.2%)',
+  '--colors-violet2': 'hsl(255 30.3% 12.9%)',
+  '--colors-violet3': 'hsl(253 37% 18.4%)',
+  '--colors-violet4': 'hsl(252 40.1% 22.5%)',
+  '--colors-violet5': 'hsl(252 42.2% 26.2%)',
+  '--colors-violet6': 'hsl(251 44.3% 31.1%)',
+  '--colors-violet7': 'hsl(250 46.8% 38.9%)',
+  '--colors-violet8': 'hsl(250 51.8% 51.2%)',
+  '--colors-violet9': 'hsl(252 56% 57.5%)',
+  '--colors-violet10': 'hsl(251 63.2% 63.2%)',
+  '--colors-violet11': 'hsl(250 95% 76.8%)',
+  '--colors-violet12': 'hsl(252 87% 96.4%)',
+  '--colors-indigo1': 'hsl(229 24% 10%)',
+  '--colors-indigo2': 'hsl(230 36.4% 12.9%)',
+  '--colors-indigo3': 'hsl(228 43.3% 17.5%)',
+  '--colors-indigo4': 'hsl(227 47.2% 21%)',
+  '--colors-indigo5': 'hsl(227 50% 24.1%)',
+  '--colors-indigo6': 'hsl(226 52.9% 28.2%)',
+  '--colors-indigo7': 'hsl(226 56% 34.5%)',
+  '--colors-indigo8': 'hsl(226 58.2% 44.1%)',
+  '--colors-indigo9': 'hsl(226 70% 55.5%)',
+  '--colors-indigo10': 'hsl(227 75.2% 61.6%)',
+  '--colors-indigo11': 'hsl(228 100% 75.9%)',
+  '--colors-indigo12': 'hsl(226 83% 96.3%)',
+  '--colors-blue1': 'hsl(212 35% 9.2%)',
+  '--colors-blue2': 'hsl(216 50% 11.8%)',
+  '--colors-blue3': 'hsl(214 59.4% 15.3%)',
+  '--colors-blue4': 'hsl(214 65.8% 17.9%)',
+  '--colors-blue5': 'hsl(213 71.2% 20.2%)',
+  '--colors-blue6': 'hsl(212 77.4% 23.1%)',
+  '--colors-blue7': 'hsl(211 85.1% 27.4%)',
+  '--colors-blue8': 'hsl(211 89.7% 34.1%)',
+  '--colors-blue9': 'hsl(206 100% 50%)',
+  '--colors-blue10': 'hsl(209 100% 60.6%)',
+  '--colors-blue11': 'hsl(210 100% 66.1%)',
+  '--colors-blue12': 'hsl(206 98% 95.8%)',
+  '--colors-sky1': 'hsl(205 45% 8.6%)',
+  '--colors-sky2': 'hsl(202 71.4% 9.6%)',
+  '--colors-sky3': 'hsl(201 74.6% 12.2%)',
+  '--colors-sky4': 'hsl(201 77.4% 14.4%)',
+  '--colors-sky5': 'hsl(200 80.3% 16.5%)',
+  '--colors-sky6': 'hsl(200 84.1% 18.9%)',
+  '--colors-sky7': 'hsl(199 90.2% 22.1%)',
+  '--colors-sky8': 'hsl(198 100% 26.1%)',
+  '--colors-sky9': 'hsl(193 98% 70%)',
+  '--colors-sky10': 'hsl(192 100% 77%)',
+  '--colors-sky11': 'hsl(192 85% 55.8%)',
+  '--colors-sky12': 'hsl(198 98% 95.8%)',
+  '--colors-mint1': 'hsl(173 50% 6.6%)',
+  '--colors-mint2': 'hsl(176 73% 7.3%)',
+  '--colors-mint3': 'hsl(175 79.3% 8.9%)',
+  '--colors-mint4': 'hsl(174 84.8% 10.3%)',
+  '--colors-mint5': 'hsl(174 90.2% 11.9%)',
+  '--colors-mint6': 'hsl(173 96% 13.8%)',
+  '--colors-mint7': 'hsl(172 100% 16.8%)',
+  '--colors-mint8': 'hsl(170 100% 21.4%)',
+  '--colors-mint9': 'hsl(167 65% 66%)',
+  '--colors-mint10': 'hsl(163 80% 77%)',
+  '--colors-mint11': 'hsl(167 70% 48%)',
+  '--colors-mint12': 'hsl(165 80% 94.8%)',
+  '--colors-cyan1': 'hsl(192 60% 7.2%)',
+  '--colors-cyan2': 'hsl(192 71.4% 8.2%)',
+  '--colors-cyan3': 'hsl(192 75.9% 10.8%)',
+  '--colors-cyan4': 'hsl(192 79.3% 12.8%)',
+  '--colors-cyan5': 'hsl(192 82.5% 14.6%)',
+  '--colors-cyan6': 'hsl(192 86.6% 16.9%)',
+  '--colors-cyan7': 'hsl(192 92.6% 20.1%)',
+  '--colors-cyan8': 'hsl(192 100% 24.5%)',
+  '--colors-cyan9': 'hsl(190 95% 39%)',
+  '--colors-cyan10': 'hsl(188 100% 40%)',
+  '--colors-cyan11': 'hsl(186 100% 42.2%)',
+  '--colors-cyan12': 'hsl(185 73% 93.2%)',
+  '--colors-teal1': 'hsl(168 48% 6.5%)',
+  '--colors-teal2': 'hsl(169 77.8% 7.1%)',
+  '--colors-teal3': 'hsl(170 76.1% 9.2%)',
+  '--colors-teal4': 'hsl(171 75.8% 11%)',
+  '--colors-teal5': 'hsl(171 75.7% 12.8%)',
+  '--colors-teal6': 'hsl(172 75.8% 15.1%)',
+  '--colors-teal7': 'hsl(172 76.7% 18.6%)',
+  '--colors-teal8': 'hsl(173 80.2% 23.7%)',
+  '--colors-teal9': 'hsl(173 80% 36%)',
+  '--colors-teal10': 'hsl(174 83.9% 38.2%)',
+  '--colors-teal11': 'hsl(174 90% 40.7%)',
+  '--colors-teal12': 'hsl(166 73% 93.1%)',
+  '--colors-green1': 'hsl(146 30% 7.4%)',
+  '--colors-green2': 'hsl(155 44.2% 8.4%)',
+  '--colors-green3': 'hsl(155 46.7% 10.9%)',
+  '--colors-green4': 'hsl(154 48.4% 12.9%)',
+  '--colors-green5': 'hsl(154 49.7% 14.9%)',
+  '--colors-green6': 'hsl(154 50.9% 17.6%)',
+  '--colors-green7': 'hsl(153 51.8% 21.8%)',
+  '--colors-green8': 'hsl(151 51.7% 28.4%)',
+  '--colors-green9': 'hsl(151 55% 41.5%)',
+  '--colors-green10': 'hsl(151 49.3% 46.5%)',
+  '--colors-green11': 'hsl(151 50% 53.2%)',
+  '--colors-green12': 'hsl(137 72% 94%)',
+  '--colors-grass1': 'hsl(146 30% 7.4%)',
+  '--colors-grass2': 'hsl(136 33.3% 8.8%)',
+  '--colors-grass3': 'hsl(137 36% 11.4%)',
+  '--colors-grass4': 'hsl(137 37.6% 13.7%)',
+  '--colors-grass5': 'hsl(136 38.7% 16%)',
+  '--colors-grass6': 'hsl(135 39.6% 19.1%)',
+  '--colors-grass7': 'hsl(134 40.3% 23.8%)',
+  '--colors-grass8': 'hsl(131 40.1% 30.8%)',
+  '--colors-grass9': 'hsl(131 41% 46.5%)',
+  '--colors-grass10': 'hsl(131 39% 52.1%)',
+  '--colors-grass11': 'hsl(131 43% 57.2%)',
+  '--colors-grass12': 'hsl(137 72% 94%)',
+  '--colors-lime1': 'hsl(75 55% 6%)',
+  '--colors-lime2': 'hsl(74 56.8% 7.3%)',
+  '--colors-lime3': 'hsl(78 50.2% 9.9%)',
+  '--colors-lime4': 'hsl(79 50.3% 12.1%)',
+  '--colors-lime5': 'hsl(79 52.6% 14.2%)',
+  '--colors-lime6': 'hsl(78 55.7% 16.7%)',
+  '--colors-lime7': 'hsl(77 59.7% 20.1%)',
+  '--colors-lime8': 'hsl(75 64.8% 24.5%)',
+  '--colors-lime9': 'hsl(81 67% 50%)',
+  '--colors-lime10': 'hsl(75 85% 60%)',
+  '--colors-lime11': 'hsl(81 70% 43.8%)',
+  '--colors-lime12': 'hsl(84 79% 92.6%)',
+  '--colors-yellow1': 'hsl(45 100% 5.5%)',
+  '--colors-yellow2': 'hsl(46 100% 6.7%)',
+  '--colors-yellow3': 'hsl(45 100% 8.7%)',
+  '--colors-yellow4': 'hsl(45 100% 10.4%)',
+  '--colors-yellow5': 'hsl(47 100% 12.1%)',
+  '--colors-yellow6': 'hsl(49 100% 14.3%)',
+  '--colors-yellow7': 'hsl(49 90.3% 18.4%)',
+  '--colors-yellow8': 'hsl(50 100% 22%)',
+  '--colors-yellow9': 'hsl(53 92% 50%)',
+  '--colors-yellow10': 'hsl(54 100% 68%)',
+  '--colors-yellow11': 'hsl(48 100% 47%)',
+  '--colors-yellow12': 'hsl(53 100% 91%)',
+  '--colors-amber1': 'hsl(36 100% 6.1%)',
+  '--colors-amber2': 'hsl(35 100% 7.6%)',
+  '--colors-amber3': 'hsl(32 100% 10.2%)',
+  '--colors-amber4': 'hsl(32 100% 12.4%)',
+  '--colors-amber5': 'hsl(33 100% 14.6%)',
+  '--colors-amber6': 'hsl(35 100% 17.1%)',
+  '--colors-amber7': 'hsl(35 91% 21.6%)',
+  '--colors-amber8': 'hsl(36 100% 25.5%)',
+  '--colors-amber9': 'hsl(39 100% 57%)',
+  '--colors-amber10': 'hsl(43 100% 64%)',
+  '--colors-amber11': 'hsl(39 90% 49.8%)',
+  '--colors-amber12': 'hsl(39 97% 93.2%)',
+  '--colors-orange1': 'hsl(30 70% 7.2%)',
+  '--colors-orange2': 'hsl(28 100% 8.4%)',
+  '--colors-orange3': 'hsl(26 91.1% 11.6%)',
+  '--colors-orange4': 'hsl(25 88.3% 14.1%)',
+  '--colors-orange5': 'hsl(24 87.6% 16.6%)',
+  '--colors-orange6': 'hsl(24 88.6% 19.8%)',
+  '--colors-orange7': 'hsl(24 92.4% 24%)',
+  '--colors-orange8': 'hsl(25 100% 29%)',
+  '--colors-orange9': 'hsl(24 94% 50%)',
+  '--colors-orange10': 'hsl(24 100% 58.5%)',
+  '--colors-orange11': 'hsl(24 100% 62.2%)',
+  '--colors-orange12': 'hsl(24 97% 93.2%)',
+  '--colors-brown1': 'hsl(22 15% 8.7%)',
+  '--colors-brown2': 'hsl(20 28.3% 10.4%)',
+  '--colors-brown3': 'hsl(20 28% 14%)',
+  '--colors-brown4': 'hsl(21 28.4% 16.5%)',
+  '--colors-brown5': 'hsl(22 28.7% 18.9%)',
+  '--colors-brown6': 'hsl(23 29% 22.3%)',
+  '--colors-brown7': 'hsl(25 29.5% 27.8%)',
+  '--colors-brown8': 'hsl(27 30.1% 35.9%)',
+  '--colors-brown9': 'hsl(28 34% 51%)',
+  '--colors-brown10': 'hsl(28 41.4% 55.8%)',
+  '--colors-brown11': 'hsl(28 60% 64.5%)',
+  '--colors-brown12': 'hsl(30 67% 94%)',
+  '--colors-bronze1': 'hsl(17 10% 8.8%)',
+  '--colors-bronze2': 'hsl(15 14.8% 10.6%)',
+  '--colors-bronze3': 'hsl(15 16.3% 14.3%)',
+  '--colors-bronze4': 'hsl(16 17.1% 17.2%)',
+  '--colors-bronze5': 'hsl(16 17.6% 19.6%)',
+  '--colors-bronze6': 'hsl(16 18.1% 22.9%)',
+  '--colors-bronze7': 'hsl(17 18.8% 28.8%)',
+  '--colors-bronze8': 'hsl(17 19.6% 38%)',
+  '--colors-bronze9': 'hsl(17 20% 54%)',
+  '--colors-bronze10': 'hsl(18 24% 59%)',
+  '--colors-bronze11': 'hsl(18 35% 68.5%)',
+  '--colors-bronze12': 'hsl(18 57% 94.1%)',
+  '--colors-gold1': 'hsl(44 9% 8.3%)',
+  '--colors-gold2': 'hsl(43 14.3% 9.6%)',
+  '--colors-gold3': 'hsl(42 15.5% 13%)',
+  '--colors-gold4': 'hsl(41 16.4% 15.6%)',
+  '--colors-gold5': 'hsl(41 16.9% 17.8%)',
+  '--colors-gold6': 'hsl(40 17.6% 20.8%)',
+  '--colors-gold7': 'hsl(38 18.5% 26.4%)',
+  '--colors-gold8': 'hsl(36 19.6% 35.1%)',
+  '--colors-gold9': 'hsl(36 20% 49.5%)',
+  '--colors-gold10': 'hsl(36 22.3% 54.5%)',
+  '--colors-gold11': 'hsl(35 30% 64%)',
+  '--colors-gold12': 'hsl(49 52% 93.8%)',
+  '--colors-grayA1': 'hsl(0 0% 100% / 0)',
+  '--colors-grayA2': 'hsl(0 0% 100% / 0.026)',
+  '--colors-grayA3': 'hsl(0 0% 100% / 0.056)',
+  '--colors-grayA4': 'hsl(0 0% 100% / 0.077)',
+  '--colors-grayA5': 'hsl(0 0% 100% / 0.103)',
+  '--colors-grayA6': 'hsl(0 0% 100% / 0.129)',
+  '--colors-grayA7': 'hsl(0 0% 100% / 0.172)',
+  '--colors-grayA8': 'hsl(0 0% 100% / 0.249)',
+  '--colors-grayA9': 'hsl(0 0% 100% / 0.386)',
+  '--colors-grayA10': 'hsl(0 0% 100% / 0.446)',
+  '--colors-grayA11': 'hsl(0 0% 100% / 0.592)',
+  '--colors-grayA12': 'hsl(0 0% 100% / 0.923)',
+  '--colors-mauveA1': 'hsl(0 0% 0% / 0)',
+  '--colors-mauveA2': 'hsl(240 76.7% 91.2% / 0.031)',
+  '--colors-mauveA3': 'hsl(240 86% 95.8% / 0.061)',
+  '--colors-mauveA4': 'hsl(240 91.8% 94.7% / 0.087)',
+  '--colors-mauveA5': 'hsl(240 91.5% 95.8% / 0.113)',
+  '--colors-mauveA6': 'hsl(240 92% 93.8% / 0.148)',
+  '--colors-mauveA7': 'hsl(240 94.8% 95.3% / 0.191)',
+  '--colors-mauveA8': 'hsl(249 98.1% 95.2% / 0.273)',
+  '--colors-mauveA9': 'hsl(248 97.6% 96.2% / 0.416)',
+  '--colors-mauveA10': 'hsl(248 95.5% 96.6% / 0.477)',
+  '--colors-mauveA11': 'hsl(250 98% 98% / 0.615)',
+  '--colors-mauveA12': 'hsl(240 93.9% 99.6% / 0.931)',
+  '--colors-slateA1': 'hsl(0 0% 0% / 0)',
+  '--colors-slateA2': 'hsl(181 98.9% 91.8% / 0.026)',
+  '--colors-slateA3': 'hsl(182 86.7% 91.4% / 0.057)',
+  '--colors-slateA4': 'hsl(209 86.7% 93.9% / 0.083)',
+  '--colors-slateA5': 'hsl(200 90.3% 93.4% / 0.109)',
+  '--colors-slateA6': 'hsl(209 95.3% 93.5% / 0.139)',
+  '--colors-slateA7': 'hsl(204 98.5% 93.9% / 0.182)',
+  '--colors-slateA8': 'hsl(209 94% 94.7% / 0.265)',
+  '--colors-slateA9': 'hsl(207 97.3% 94% / 0.412)',
+  '--colors-slateA10': 'hsl(209 99.4% 95.2% / 0.472)',
+  '--colors-slateA11': 'hsl(208 98.7% 96.8% / 0.615)',
+  '--colors-slateA12': 'hsl(211 86.7% 99.6% / 0.927)',
+  '--colors-sageA1': 'hsl(0 0% 0% / 0)',
+  '--colors-sageA2': 'hsl(123 94.4% 91.4% / 0.026)',
+  '--colors-sageA3': 'hsl(123 82.9% 91% / 0.057)',
+  '--colors-sageA4': 'hsl(124 97.9% 94.5% / 0.082)',
+  '--colors-sageA5': 'hsl(125 90% 95.2% / 0.104)',
+  '--colors-sageA6': 'hsl(142 95.1% 94.8% / 0.134)',
+  '--colors-sageA7': 'hsl(143 92.8% 95.7% / 0.173)',
+  '--colors-sageA8': 'hsl(146 94.7% 95.3% / 0.255)',
+  '--colors-sageA9': 'hsl(151 98.2% 94.4% / 0.397)',
+  '--colors-sageA10': 'hsl(148 99.5% 95.5% / 0.457)',
+  '--colors-sageA11': 'hsl(152 95.1% 97.3% / 0.6)',
+  '--colors-sageA12': 'hsl(149 93.3% 99.6% / 0.927)',
+  '--colors-oliveA1': 'hsl(0 0% 0% / 0)',
+  '--colors-oliveA2': 'hsl(91 97% 84% / 0.026)',
+  '--colors-oliveA3': 'hsl(101 87.4% 87.7% / 0.057)',
+  '--colors-oliveA4': 'hsl(92 91.8% 94.1% / 0.078)',
+  '--colors-oliveA5': 'hsl(101 92.6% 93.5% / 0.104)',
+  '--colors-oliveA6': 'hsl(102 91.1% 94.6% / 0.13)',
+  '--colors-oliveA7': 'hsl(102 92.5% 95.9% / 0.173)',
+  '--colors-oliveA8': 'hsl(107 100% 96.5% / 0.25)',
+  '--colors-oliveA9': 'hsl(110 98.3% 94.1% / 0.397)',
+  '--colors-oliveA10': 'hsl(109 99.6% 95.3% / 0.457)',
+  '--colors-oliveA11': 'hsl(113 95.3% 97.2% / 0.6)',
+  '--colors-oliveA12': 'hsl(120 93.5% 99.6% / 0.927)',
+  '--colors-sandA1': 'hsl(0 0% 0% / 0)',
+  '--colors-sandA2': 'hsl(60 89.8% 91.4% / 0.026)',
+  '--colors-sandA3': 'hsl(60 95.5% 92.5% / 0.056)',
+  '--colors-sandA4': 'hsl(60 75.6% 96.4% / 0.078)',
+  '--colors-sandA5': 'hsl(60 81.9% 95.2% / 0.104)',
+  '--colors-sandA6': 'hsl(41 87.6% 94.8% / 0.134)',
+  '--colors-sandA7': 'hsl(60 95.4% 96.2% / 0.172)',
+  '--colors-sandA8': 'hsl(49 93.5% 95.7% / 0.254)',
+  '--colors-sandA9': 'hsl(52 97.3% 96.2% / 0.391)',
+  '--colors-sandA10': 'hsl(52 97.8% 96.7% / 0.451)',
+  '--colors-sandA11': 'hsl(51 97% 97.8% / 0.597)',
+  '--colors-sandA12': 'hsl(60 88.7% 99.8% / 0.923)',
+  '--colors-tomatoA1': 'hsl(0 0% 0% / 0)',
+  '--colors-tomatoA2': 'hsl(5 100% 49.6% / 0.058)',
+  '--colors-tomatoA3': 'hsl(6 99.6% 54.9% / 0.133)',
+  '--colors-tomatoA4': 'hsl(6 99.2% 55.4% / 0.191)',
+  '--colors-tomatoA5': 'hsl(6 99.5% 55.8% / 0.244)',
+  '--colors-tomatoA6': 'hsl(7 99.7% 55.9% / 0.319)',
+  '--colors-tomatoA7': 'hsl(8 99.8% 54.8% / 0.434)',
+  '--colors-tomatoA8': 'hsl(10 99.8% 53.5% / 0.598)',
+  '--colors-tomatoA9': 'hsl(10 100% 59.7% / 0.885)',
+  '--colors-tomatoA10': 'hsl(10 100% 63.6% / 0.916)',
+  '--colors-tomatoA11': 'hsl(10 99.7% 66.4% / 0.939)',
+  '--colors-tomatoA12': 'hsl(12 100% 97.1% / 0.98)',
+  '--colors-redA1': 'hsl(0 0% 0% / 0)',
+  '--colors-redA2': 'hsl(5 98.5% 53.8% / 0.045)',
+  '--colors-redA3': 'hsl(359 99.1% 61.1% / 0.13)',
+  '--colors-redA4': 'hsl(358 98.8% 61% / 0.184)',
+  '--colors-redA5': 'hsl(357 99.6% 60.3% / 0.237)',
+  '--colors-redA6': 'hsl(358 99.6% 60.3% / 0.322)',
+  '--colors-redA7': 'hsl(357 100% 59.5% / 0.442)',
+  '--colors-redA8': 'hsl(358 99.8% 59.1% / 0.621)',
+  '--colors-redA9': 'hsl(358 100% 65.5% / 0.884)',
+  '--colors-redA10': 'hsl(358 100% 67.5% / 0.942)',
+  '--colors-redA11': 'hsl(358 100% 69.7% / 0.98)',
+  '--colors-redA12': 'hsl(352 100% 97.1% / 0.98)',
+  '--colors-crimsonA1': 'hsl(0 0% 0% / 0)',
+  '--colors-crimsonA2': 'hsl(336 96.8% 53.2% / 0.045)',
+  '--colors-crimsonA3': 'hsl(335 98.7% 59.3% / 0.138)',
+  '--colors-crimsonA4': 'hsl(336 99.1% 59.9% / 0.191)',
+  '--colors-crimsonA5': 'hsl(335 99.4% 59.4% / 0.244)',
+  '--colors-crimsonA6': 'hsl(335 99.4% 59.4% / 0.315)',
+  '--colors-crimsonA7': 'hsl(336 99.5% 57.8% / 0.439)',
+  '--colors-crimsonA8': 'hsl(336 99.9% 55.4% / 0.642)',
+  '--colors-crimsonA9': 'hsl(336 99.9% 62.8% / 0.903)',
+  '--colors-crimsonA10': 'hsl(339 99.9% 66.3% / 0.934)',
+  '--colors-crimsonA11': 'hsl(341 99.9% 69.5% / 0.965)',
+  '--colors-crimsonA12': 'hsl(327 100% 97.1% / 0.98)',
+  '--colors-pinkA1': 'hsl(0 0% 0% / 0)',
+  '--colors-pinkA2': 'hsl(320 98.1% 64.1% / 0.036)',
+  '--colors-pinkA3': 'hsl(320 99.1% 63.1% / 0.121)',
+  '--colors-pinkA4': 'hsl(320 99.5% 62.7% / 0.17)',
+  '--colors-pinkA5': 'hsl(319 99.7% 61.5% / 0.219)',
+  '--colors-pinkA6': 'hsl(322 99.4% 60.8% / 0.291)',
+  '--colors-pinkA7': 'hsl(321 99.6% 58.7% / 0.407)',
+  '--colors-pinkA8': 'hsl(322 99.7% 55.4% / 0.608)',
+  '--colors-pinkA9': 'hsl(322 100% 64.6% / 0.817)',
+  '--colors-pinkA10': 'hsl(323 100% 66.3% / 0.875)',
+  '--colors-pinkA11': 'hsl(325 99.9% 68.6% / 0.96)',
+  '--colors-pinkA12': 'hsl(314 100% 96.9% / 0.98)',
+  '--colors-plumA1': 'hsl(0 0% 0% / 0)',
+  '--colors-plumA2': 'hsl(300 96.4% 58.4% / 0.036)',
+  '--colors-plumA3': 'hsl(300 99.4% 67.1% / 0.102)',
+  '--colors-plumA4': 'hsl(295 99.8% 66.3% / 0.155)',
+  '--colors-plumA5': 'hsl(295 99.4% 67.1% / 0.204)',
+  '--colors-plumA6': 'hsl(294 99% 67.8% / 0.262)',
+  '--colors-plumA7': 'hsl(294 99.9% 67.7% / 0.363)',
+  '--colors-plumA8': 'hsl(292 99.8% 67.5% / 0.527)',
+  '--colors-plumA9': 'hsl(292 99.9% 69.2% / 0.695)',
+  '--colors-plumA10': 'hsl(295 99.9% 70.8% / 0.748)',
+  '--colors-plumA11': 'hsl(300 99.8% 72.9% / 0.828)',
+  '--colors-plumA12': 'hsl(300 100% 97.1% / 0.98)',
+  '--colors-purpleA1': 'hsl(0 0% 0% / 0)',
+  '--colors-purpleA2': 'hsl(280 96.5% 57.5% / 0.045)',
+  '--colors-purpleA3': 'hsl(279 98.7% 62.8% / 0.129)',
+  '--colors-purpleA4': 'hsl(279 99.1% 64% / 0.191)',
+  '--colors-purpleA5': 'hsl(278 99.8% 64.2% / 0.248)',
+  '--colors-purpleA6': 'hsl(276 99.6% 64.6% / 0.328)',
+  '--colors-purpleA7': 'hsl(274 99.9% 64.6% / 0.456)',
+  '--colors-purpleA8': 'hsl(272 99.7% 64.6% / 0.66)',
+  '--colors-purpleA9': 'hsl(272 99.9% 69.1% / 0.748)',
+  '--colors-purpleA10': 'hsl(273 100% 71.3% / 0.801)',
+  '--colors-purpleA11': 'hsl(275 99.9% 75.3% / 0.934)',
+  '--colors-purpleA12': 'hsl(286 100% 97.1% / 0.98)',
+  '--colors-violetA1': 'hsl(0 0% 0% / 0)',
+  '--colors-violetA2': 'hsl(258 98.2% 61% / 0.054)',
+  '--colors-violetA3': 'hsl(252 98.8% 65.8% / 0.148)',
+  '--colors-violetA4': 'hsl(253 99.7% 65.7% / 0.219)',
+  '--colors-violetA5': 'hsl(252 99.7% 66.4% / 0.286)',
+  '--colors-violetA6': 'hsl(251 99.7% 66.2% / 0.371)',
+  '--colors-violetA7': 'hsl(250 99.7% 66.3% / 0.514)',
+  '--colors-violetA8': 'hsl(250 99.7% 66.1% / 0.733)',
+  '--colors-violetA9': 'hsl(252 99.9% 70.3% / 0.786)',
+  '--colors-violetA10': 'hsl(251 99.9% 72.9% / 0.844)',
+  '--colors-violetA11': 'hsl(250 100% 77.9% / 0.98)',
+  '--colors-violetA12': 'hsl(254 100% 97.5% / 0.98)',
+  '--colors-indigoA1': 'hsl(0 0% 0% / 0)',
+  '--colors-indigoA2': 'hsl(234 97.4% 59.9% / 0.059)',
+  '--colors-indigoA3': 'hsl(228 99.2% 61.7% / 0.144)',
+  '--colors-indigoA4': 'hsl(227 99.7% 62% / 0.211)',
+  '--colors-indigoA5': 'hsl(227 99.2% 62.3% / 0.27)',
+  '--colors-indigoA6': 'hsl(226 99.9% 62.1% / 0.35)',
+  '--colors-indigoA7': 'hsl(226 99.9% 62% / 0.471)',
+  '--colors-indigoA8': 'hsl(226 99.9% 62.1% / 0.655)',
+  '--colors-indigoA9': 'hsl(226 99.9% 63.6% / 0.848)',
+  '--colors-indigoA10': 'hsl(227 99.8% 67.7% / 0.893)',
+  '--colors-indigoA11': 'hsl(227 100% 76.3% / 0.98)',
+  '--colors-indigoA12': 'hsl(226 100% 97.5% / 0.98)',
+  '--colors-blueA1': 'hsl(0 0% 0% / 0)',
+  '--colors-blueA2': 'hsl(221 97.8% 52.4% / 0.059)',
+  '--colors-blueA3': 'hsl(215 99.3% 54.2% / 0.135)',
+  '--colors-blueA4': 'hsl(215 99.3% 53.8% / 0.198)',
+  '--colors-blueA5': 'hsl(213 99.4% 52.8% / 0.252)',
+  '--colors-blueA6': 'hsl(212 99.9% 51.7% / 0.323)',
+  '--colors-blueA7': 'hsl(211 100% 50.7% / 0.435)',
+  '--colors-blueA8': 'hsl(211 99.8% 50.9% / 0.597)',
+  '--colors-blueA9': 'hsl(205 100% 50% / 0.98)',
+  '--colors-blueA10': 'hsl(208 100% 60.7% / 0.98)',
+  '--colors-blueA11': 'hsl(209 100% 66.3% / 0.98)',
+  '--colors-blueA12': 'hsl(196 100% 96.8% / 0.98)',
+  '--colors-skyA1': 'hsl(0 0% 0% / 0)',
+  '--colors-skyA2': 'hsl(208 100% 49.8% / 0.045)',
+  '--colors-skyA3': 'hsl(201 100% 49.8% / 0.099)',
+  '--colors-skyA4': 'hsl(201 100% 50% / 0.148)',
+  '--colors-skyA5': 'hsl(200 100% 49.8% / 0.198)',
+  '--colors-skyA6': 'hsl(199 100% 49.9% / 0.256)',
+  '--colors-skyA7': 'hsl(199 100% 49.9% / 0.337)',
+  '--colors-skyA8': 'hsl(199 100% 50% / 0.453)',
+  '--colors-skyA9': 'hsl(192 100% 70.8% / 0.98)',
+  '--colors-skyA10': 'hsl(190 100% 77.6% / 0.98)',
+  '--colors-skyA11': 'hsl(192 99.9% 59.6% / 0.924)',
+  '--colors-skyA12': 'hsl(189 100% 96.8% / 0.98)',
+  '--colors-mintA1': 'hsl(0 0% 0% / 0)',
+  '--colors-mintA2': 'hsl(180 100% 49.2% / 0.031)',
+  '--colors-mintA3': 'hsl(176 100% 49.7% / 0.07)',
+  '--colors-mintA4': 'hsl(173 100% 49.7% / 0.105)',
+  '--colors-mintA5': 'hsl(173 100% 49.8% / 0.144)',
+  '--colors-mintA6': 'hsl(172 100% 49.8% / 0.192)',
+  '--colors-mintA7': 'hsl(171 100% 49.9% / 0.266)',
+  '--colors-mintA8': 'hsl(169 100% 49.9% / 0.366)',
+  '--colors-mintA9': 'hsl(167 99.8% 75% / 0.87)',
+  '--colors-mintA10': 'hsl(163 99.9% 80.7% / 0.948)',
+  '--colors-mintA11': 'hsl(167 99.9% 58.7% / 0.796)',
+  '--colors-mintA12': 'hsl(169 100% 96.2% / 0.98)',
+  '--colors-cyanA1': 'hsl(0 0% 0% / 0)',
+  '--colors-cyanA2': 'hsl(196 100% 50% / 0.031)',
+  '--colors-cyanA3': 'hsl(192 98% 50.9% / 0.085)',
+  '--colors-cyanA4': 'hsl(194 99.6% 51.3% / 0.133)',
+  '--colors-cyanA5': 'hsl(192 99.5% 51.3% / 0.173)',
+  '--colors-cyanA6': 'hsl(193 99.7% 50.4% / 0.226)',
+  '--colors-cyanA7': 'hsl(192 100% 50% / 0.31)',
+  '--colors-cyanA8': 'hsl(193 100% 50% / 0.425)',
+  '--colors-cyanA9': 'hsl(190 99.8% 50.8% / 0.731)',
+  '--colors-cyanA10': 'hsl(188 100% 50% / 0.775)',
+  '--colors-cyanA11': 'hsl(186 100% 49.9% / 0.824)',
+  '--colors-cyanA12': 'hsl(185 99.8% 95.1% / 0.978)',
+  '--colors-tealA1': 'hsl(0 0% 0% / 0)',
+  '--colors-tealA2': 'hsl(171 100% 49.2% / 0.031)',
+  '--colors-tealA3': 'hsl(172 100% 49.7% / 0.07)',
+  '--colors-tealA4': 'hsl(175 100% 49.7% / 0.105)',
+  '--colors-tealA5': 'hsl(174 98.9% 50.1% / 0.14)',
+  '--colors-tealA6': 'hsl(174 100% 51.8% / 0.187)',
+  '--colors-tealA7': 'hsl(173 99.6% 53.2% / 0.257)',
+  '--colors-tealA8': 'hsl(174 99.6% 53.3% / 0.366)',
+  '--colors-tealA9': 'hsl(173 99.9% 54.6% / 0.609)',
+  '--colors-tealA10': 'hsl(174 99.9% 53.8% / 0.67)',
+  '--colors-tealA11': 'hsl(174 100% 52% / 0.748)',
+  '--colors-tealA12': 'hsl(166 98.6% 95% / 0.979)',
+  '--colors-greenA1': 'hsl(0 0% 0% / 0)',
+  '--colors-greenA2': 'hsl(169 100% 48.5% / 0.027)',
+  '--colors-greenA3': 'hsl(162 98.7% 57.9% / 0.07)',
+  '--colors-greenA4': 'hsl(158 98.6% 59.7% / 0.105)',
+  '--colors-greenA5': 'hsl(158 98.6% 60.7% / 0.14)',
+  '--colors-greenA6': 'hsl(156 99.9% 62% / 0.187)',
+  '--colors-greenA7': 'hsl(154 99.5% 63.1% / 0.257)',
+  '--colors-greenA8': 'hsl(152 99.7% 64.2% / 0.37)',
+  '--colors-greenA9': 'hsl(151 99.7% 63.8% / 0.605)',
+  '--colors-greenA10': 'hsl(152 99.9% 66.5% / 0.661)',
+  '--colors-greenA11': 'hsl(151 99.7% 69.2% / 0.74)',
+  '--colors-greenA12': 'hsl(137 100% 95.8% / 0.98)',
+  '--colors-grassA1': 'hsl(0 0% 0% / 0)',
+  '--colors-grassA2': 'hsl(107 97.2% 61.9% / 0.022)',
+  '--colors-grassA3': 'hsl(128 96.5% 69.8% / 0.066)',
+  '--colors-grassA4': 'hsl(130 100% 70.2% / 0.1)',
+  '--colors-grassA5': 'hsl(130 98.2% 69.1% / 0.14)',
+  '--colors-grassA6': 'hsl(132 99.9% 69.3% / 0.187)',
+  '--colors-grassA7': 'hsl(132 99.9% 69.8% / 0.261)',
+  '--colors-grassA8': 'hsl(130 99.6% 70.5% / 0.37)',
+  '--colors-grassA9': 'hsl(130 99.7% 70.6% / 0.618)',
+  '--colors-grassA10': 'hsl(131 100% 73.5% / 0.674)',
+  '--colors-grassA11': 'hsl(130 99.7% 75.6% / 0.731)',
+  '--colors-grassA12': 'hsl(137 100% 95.8% / 0.98)',
+  '--colors-limeA1': 'hsl(0 0% 0% / 0)',
+  '--colors-limeA2': 'hsl(75 96.4% 59.6% / 0.022)',
+  '--colors-limeA3': 'hsl(88 98% 70.4% / 0.061)',
+  '--colors-limeA4': 'hsl(81 97.8% 67.4% / 0.096)',
+  '--colors-limeA5': 'hsl(82 98.4% 65.6% / 0.135)',
+  '--colors-limeA6': 'hsl(79 99.7% 64.3% / 0.182)',
+  '--colors-limeA7': 'hsl(77 99.1% 62.1% / 0.252)',
+  '--colors-limeA8': 'hsl(75 100% 60% / 0.342)',
+  '--colors-limeA9': 'hsl(81 99.8% 59.7% / 0.819)',
+  '--colors-limeA10': 'hsl(75 99.8% 63.7% / 0.936)',
+  '--colors-limeA11': 'hsl(81 99.9% 58.7% / 0.719)',
+  '--colors-limeA12': 'hsl(83 100% 94.2% / 0.98)',
+  '--colors-yellowA1': 'hsl(0 0% 0% / 0)',
+  '--colors-yellowA2': 'hsl(49 100% 49.1% / 0.027)',
+  '--colors-yellowA3': 'hsl(45 100% 49.7% / 0.071)',
+  '--colors-yellowA4': 'hsl(46 100% 49.7% / 0.111)',
+  '--colors-yellowA5': 'hsl(47 100% 49.9% / 0.15)',
+  '--colors-yellowA6': 'hsl(51 100% 49.8% / 0.199)',
+  '--colors-yellowA7': 'hsl(51 99.8% 53.6% / 0.269)',
+  '--colors-yellowA8': 'hsl(51 100% 49.9% / 0.371)',
+  '--colors-yellowA9': 'hsl(53 100% 52% / 0.956)',
+  '--colors-yellowA10': 'hsl(56 100% 68.4% / 0.98)',
+  '--colors-yellowA11': 'hsl(48 100% 50% / 0.934)',
+  '--colors-yellowA12': 'hsl(60 100% 91.8% / 0.98)',
+  '--colors-amberA1': 'hsl(0 0% 0% / 0)',
+  '--colors-amberA2': 'hsl(31 100% 49.7% / 0.036)',
+  '--colors-amberA3': 'hsl(27 100% 49.9% / 0.094)',
+  '--colors-amberA4': 'hsl(29 100% 50% / 0.143)',
+  '--colors-amberA5': 'hsl(31 100% 50% / 0.192)',
+  '--colors-amberA6': 'hsl(35 100% 50% / 0.25)',
+  '--colors-amberA7': 'hsl(34 99.6% 52.9% / 0.331)',
+  '--colors-amberA8': 'hsl(36 100% 50% / 0.442)',
+  '--colors-amberA9': 'hsl(40 100% 57.2% / 0.98)',
+  '--colors-amberA10': 'hsl(44 100% 64.2% / 0.98)',
+  '--colors-amberA11': 'hsl(39 99.9% 52.7% / 0.938)',
+  '--colors-amberA12': 'hsl(45 100% 94.2% / 0.98)',
+  '--colors-orangeA1': 'hsl(0 0% 0% / 0)',
+  '--colors-orangeA2': 'hsl(13 100% 49.7% / 0.054)',
+  '--colors-orangeA3': 'hsl(20 100% 49.7% / 0.117)',
+  '--colors-orangeA4': 'hsl(23 100% 49.8% / 0.166)',
+  '--colors-orangeA5': 'hsl(23 99.4% 50.1% / 0.215)',
+  '--colors-orangeA6': 'hsl(23 99.8% 51.1% / 0.286)',
+  '--colors-orangeA7': 'hsl(23 99.7% 50.6% / 0.389)',
+  '--colors-orangeA8': 'hsl(24 100% 49.9% / 0.523)',
+  '--colors-orangeA9': 'hsl(24 99.9% 51.6% / 0.965)',
+  '--colors-orangeA10': 'hsl(25 100% 58.6% / 0.98)',
+  '--colors-orangeA11': 'hsl(24 100% 62.4% / 0.98)',
+  '--colors-orangeA12': 'hsl(26 100% 94.2% / 0.98)',
+  '--colors-brownA1': 'hsl(0 0% 0% / 0)',
+  '--colors-brownA2': 'hsl(22 99.6% 53.6% / 0.035)',
+  '--colors-brownA3': 'hsl(18 97.8% 69% / 0.088)',
+  '--colors-brownA4': 'hsl(21 98.2% 71% / 0.123)',
+  '--colors-brownA5': 'hsl(25 98.4% 72.1% / 0.158)',
+  '--colors-brownA6': 'hsl(25 98.7% 73.5% / 0.206)',
+  '--colors-brownA7': 'hsl(25 99% 74.6% / 0.289)',
+  '--colors-brownA8': 'hsl(28 99.2% 75.3% / 0.407)',
+  '--colors-brownA9': 'hsl(28 100% 74.8% / 0.642)',
+  '--colors-brownA10': 'hsl(28 99.9% 74.9% / 0.712)',
+  '--colors-brownA11': 'hsl(28 99.9% 74.9% / 0.843)',
+  '--colors-brownA12': 'hsl(32 98.2% 95.7% / 0.979)',
+  '--colors-bronzeA1': 'hsl(0 0% 0% / 0)',
+  '--colors-bronzeA2': 'hsl(20 88.2% 74.2% / 0.027)',
+  '--colors-bronzeA3': 'hsl(10 99.4% 83% / 0.074)',
+  '--colors-bronzeA4': 'hsl(18 96% 81.1% / 0.114)',
+  '--colors-bronzeA5': 'hsl(18 99.4% 81.7% / 0.148)',
+  '--colors-bronzeA6': 'hsl(15 98.1% 82.4% / 0.192)',
+  '--colors-bronzeA7': 'hsl(16 99.2% 82.9% / 0.27)',
+  '--colors-bronzeA8': 'hsl(18 99.5% 82.6% / 0.396)',
+  '--colors-bronzeA9': 'hsl(18 99.3% 85% / 0.592)',
+  '--colors-bronzeA10': 'hsl(18 99.6% 85.2% / 0.657)',
+  '--colors-bronzeA11': 'hsl(17 99.9% 86.1% / 0.774)',
+  '--colors-bronzeA12': 'hsl(20 99.8% 96.4% / 0.974)',
+  '--colors-goldA1': 'hsl(0 0% 0% / 0)',
+  '--colors-goldA2': 'hsl(40 93.7% 70.6% / 0.022)',
+  '--colors-goldA3': 'hsl(40 97.5% 80.6% / 0.065)',
+  '--colors-goldA4': 'hsl(40 95.9% 80.8% / 0.1)',
+  '--colors-goldA5': 'hsl(38 97.3% 82.1% / 0.13)',
+  '--colors-goldA6': 'hsl(39 97.2% 82.5% / 0.169)',
+  '--colors-goldA7': 'hsl(37 99.3% 82.4% / 0.246)',
+  '--colors-goldA8': 'hsl(35 98.7% 82.2% / 0.363)',
+  '--colors-goldA9': 'hsl(36 99.7% 82.8% / 0.552)',
+  '--colors-goldA10': 'hsl(35 99.2% 83.7% / 0.613)',
+  '--colors-goldA11': 'hsl(35 99.3% 85.3% / 0.725)',
+  '--colors-goldA12': 'hsl(49 98.6% 96.7% / 0.966)',
+}
diff --git a/packages/common2/tailwind.config.js b/packages/common2/tailwind.config.js
index 9c2af498997..c1a046ced35 100644
--- a/packages/common2/tailwind.config.js
+++ b/packages/common2/tailwind.config.js
@@ -1 +1,477 @@
-module.exports = require('config/tailwind.config')
+const gray = {
+  100: '#eeeeee',
+  200: '#e0e0e0',
+  300: '#bbbbbb',
+  400: '#666666',
+  500: '#444444',
+  650: '#333',
+  600: '#2a2a2a',
+  700: '#1f1f1f',
+  800: '#181818',
+  900: '#0f0f0f',
+}
+const brand = {
+  100: '#c5f1dd',
+  200: '#c5f1dd',
+  300: '#9fe7c7',
+  400: '#65d9a5',
+  500: '#24b47e',
+  600: '#38bc81',
+  700: '#1c8656',
+  800: '#10633e',
+  900: '#10633e',
+}
+
+const blueGray = {
+  50: '#F8FAFC',
+  100: '#F1F5F9',
+  200: '#E2E8F0',
+  300: '#CBD5E1',
+  400: '#94A3B8',
+  500: '#64748B',
+  600: '#475569',
+  700: '#334155',
+  800: '#1E293B',
+  900: '#0F172A',
+}
+
+const coolGray = {
+  50: '#F9FAFB',
+  100: '#F3F4F6',
+  200: '#E5E7EB',
+  300: '#D1D5DB',
+  400: '#9CA3AF',
+  500: '#6B7280',
+  600: '#4B5563',
+  700: '#374151',
+  800: '#1F2937',
+  900: '#111827',
+}
+
+const colors = {
+  // transparent: 'transparent',
+  // white: '#ffffff',
+  // black: '#000000',
+  // gray: {
+  //   '50': '#f9fafb',
+  //   '100': '#f4f5f7',
+  //   '200': '#e5e7eb',
+  //   '300': '#d5d6d7',
+  //   '400': '#9e9e9e',
+  //   '500': '#707275',
+  //   '600': '#4c4f52',
+  //   '700': '#24262d',
+  //   '800': '#1a1c23',
+  //   '900': '#121317',
+  //   // default values from Tailwind UI palette
+  //   // '300': '#d2d6dc',
+  //   // '400': '#9fa6b2',
+  //   // '500': '#6b7280',
+  //   // '600': '#4b5563',
+  //   // '700': '#374151',
+  //   // '800': '#252f3f',
+  //   // '900': '#161e2e',
+  // },
+  red: {
+    50: '#fdf2f2',
+    100: '#fde8e8',
+    200: '#fbd5d5',
+    300: '#f8b4b4',
+    400: '#f98080',
+    500: '#f05252',
+    600: '#e02424',
+    700: '#c81e1e',
+    800: '#9b1c1c',
+    900: '#771d1d',
+  },
+  orange: {
+    50: '#fff8f1',
+    100: '#feecdc',
+    200: '#fcd9bd',
+    300: '#fdba8c',
+    400: '#ff8a4c',
+    500: '#ff5a1f',
+    600: '#d03801',
+    700: '#b43403',
+    800: '#8a2c0d',
+    900: '#771d1d',
+  },
+  yellow: {
+    50: '#fdfdea',
+    100: '#fdf6b2',
+    200: '#fce96a',
+    300: '#faca15',
+    400: '#e3a008',
+    500: '#c27803',
+    600: '#9f580a',
+    700: '#8e4b10',
+    800: '#723b13',
+    900: '#633112',
+  },
+  green: {
+    50: '#f3faf7',
+    100: '#def7ec',
+    200: '#bcf0da',
+    300: '#84e1bc',
+    400: '#31c48d',
+    500: '#0e9f6e',
+    600: '#057a55',
+    700: '#046c4e',
+    800: '#03543f',
+    900: '#014737',
+  },
+  teal: {
+    50: '#edfafa',
+    100: '#d5f5f6',
+    200: '#afecef',
+    300: '#7edce2',
+    400: '#16bdca',
+    500: '#0694a2',
+    600: '#047481',
+    700: '#036672',
+    800: '#05505c',
+    900: '#014451',
+  },
+  blue: {
+    50: '#ebf5ff',
+    100: '#e1effe',
+    200: '#c3ddfd',
+    300: '#a4cafe',
+    400: '#76a9fa',
+    500: '#3f83f8',
+    600: '#1c64f2',
+    700: '#1a56db',
+    800: '#1e429f',
+    900: '#233876',
+  },
+  indigo: {
+    50: '#f0f5ff',
+    100: '#e5edff',
+    200: '#cddbfe',
+    300: '#b4c6fc',
+    400: '#8da2fb',
+    500: '#6875f5',
+    600: '#5850ec',
+    700: '#5145cd',
+    800: '#42389d',
+    900: '#362f78',
+  },
+  purple: {
+    50: '#f6f5ff',
+    100: '#edebfe',
+    200: '#dcd7fe',
+    300: '#cabffd',
+    400: '#ac94fa',
+    500: '#9061f9',
+    600: '#7e3af2',
+    700: '#6c2bd9',
+    800: '#5521b5',
+    900: '#4a1d96',
+  },
+  pink: {
+    50: '#fdf2f8',
+    100: '#fce8f3',
+    200: '#fad1e8',
+    300: '#f8b4d9',
+    400: '#f17eb8',
+    500: '#e74694',
+    600: '#d61f69',
+    700: '#bf125d',
+    800: '#99154b',
+    900: '#751a3d',
+  },
+}
+
+const dark = {
+  50: '#eeeeee',
+  100: '#eeeeee',
+  200: '#e0e0e0',
+  300: '#bbbbbb',
+  400: '#666666',
+  500: '#444444',
+  600: '#2a2a2a',
+  700: '#1f1f1f',
+  800: '#181818',
+  900: '#0f0f0f',
+}
+
+const sbui_border = {
+  100: 'var(--border-1)',
+  200: 'var(--border-2)',
+  300: 'var(--border-3)',
+  400: 'var(--border-4)',
+  500: 'var(--border-5)',
+  600: 'var(--border-6)',
+  700: 'var(--border-7)',
+  800: 'var(--border-8)',
+  900: 'var(--border-9)',
+  1000: 'var(--border-10)',
+  1100: 'var(--border-11)',
+  1200: 'var(--border-12)',
+}
+
+const sbui_background = {
+  100: 'var(--background-1)',
+  200: 'var(--background-2)',
+  300: 'var(--background-3)',
+  400: 'var(--background-4)',
+  500: 'var(--background-5)',
+  600: 'var(--background-6)',
+  700: 'var(--background-7)',
+  800: 'var(--background-8)',
+  900: 'var(--background-9)',
+  1000: 'var(--background-10)',
+  1100: 'var(--background-11)',
+  1200: 'var(--background-12)',
+}
+
+const sbui_brand = {
+  100: 'var(--brand-1)',
+  200: 'var(--brand-2)',
+  300: 'var(--brand-3)',
+  400: 'var(--brand-4)',
+  500: 'var(--brand-5)',
+  600: 'var(--brand-6)',
+  700: 'var(--brand-7)',
+  800: 'var(--brand-8)',
+  900: 'var(--brand-9)',
+  1000: 'var(--brand-10)',
+  1100: 'var(--brand-11)',
+  1200: 'var(--brand-12)',
+}
+
+const sbui_brand_fixed = {
+  100: 'var(--brand-fixed-1)',
+  200: 'var(--brand-fixed-2)',
+  300: 'var(--brand-fixed-3)',
+  400: 'var(--brand-fixed-4)',
+  500: 'var(--brand-fixed-5)',
+  600: 'var(--brand-fixed-6)',
+  700: 'var(--brand-fixed-7)',
+  800: 'var(--brand-fixed-8)',
+  900: 'var(--brand-fixed-9)',
+  1000: 'var(--brand-fixed-10)',
+  1100: 'var(--brand-fixed-11)',
+  1200: 'var(--brand-fixed-12)',
+}
+
+function generateRadixVariables() {
+  const colors = [
+    'brand',
+    'brand-fixed',
+    'scale',
+    'tomato',
+    'red',
+    'crimson',
+    'pink',
+    'plum',
+    'purple',
+    'violet',
+    'indigo',
+    'blue',
+    'cyan',
+    'teal',
+    'green',
+    'grass',
+    'brown',
+    'orange',
+    'sky',
+    'mint',
+    'lime',
+    'yellow',
+    'amber',
+    'gold',
+    'bronze',
+    'gray',
+    'mauve',
+    'slate',
+    'sage',
+    'olive',
+    'sand',
+  ]
+
+  let mappedColors = {}
+
+  colors.map((x) => {
+    mappedColors[x] = {}
+  })
+
+  colors.map((x) => {
+    for (let index = 0; index < 12; index++) {
+      const step = index + 1
+      mappedColors[x][step * 100] = `var(--colors-${x}${step})`
+    }
+  })
+
+  return mappedColors
+}
+
+const custom_colors = generateRadixVariables()
+
+// console.log('radix colors', custom_colors)
+
+const ui = require('./ui.config.js')
+
+module.exports = ui({
+  content: {
+    // enabled: true,
+    content: [
+      './src/**/**/*.{js,ts,jsx,tsx,html,mdx}',
+      './src/**/*.{js,ts,jsx,tsx,html,mdx}',
+      './src/**/*.{js,ts,jsx,tsx,html,mdx}',
+      './src/lib/theme/defaultTheme.ts',
+    ],
+    // safelist: ['space-x-1'],
+  },
+  darkMode: 'class',
+  theme: {
+    // colors: {
+    //   gray: { ...custom_colors.gray },
+    //   slate: { ...custom_colors.slate },
+    // },
+    extend: {
+      typography: {
+        DEFAULT: {
+          css: {
+            'code::before': {
+              content: '""',
+            },
+            'code::after': {
+              content: '""',
+            },
+          },
+        },
+      },
+      colors: {
+        /* 
+          main
+        */
+        ['brandColor']: '#EC6F0D',
+
+        ['brandScale']: { ...sbui_brand },
+        ['brandScaleFixed']: { ...sbui_brand_fixed },
+
+        // used for backgrounds
+        ['bgScale']: { ...sbui_background },
+        ['bgScaleDark']: { ...dark },
+
+        // used for borders, inputs and text
+        ['grayScale']: { ...sbui_border },
+        ['grayScaleDark']: { ...gray },
+
+        /* 
+          typography
+        */
+        'typography-body': {
+          light: coolGray[600],
+          dark: gray[100],
+        },
+        'typography-body-secondary': {
+          light: coolGray[500],
+          dark: gray[300],
+        },
+        'typography-body-strong': {
+          light: coolGray[100],
+          dark: 'white',
+        },
+        'typography-body-faded': {
+          light: coolGray[400],
+          dark: gray[400],
+        },
+
+        /* 
+          app backgrounds
+        */
+        'bg-primary': {
+          light: 'white',
+          dark: gray[800],
+        },
+        'bg-secondary': {
+          light: blueGray[100],
+          dark: gray[700],
+        },
+        'bg-alt': {
+          light: blueGray[50], // gray[100],
+          dark: gray[600],
+        },
+
+        /* 
+          Forms
+        */
+        'input-value': {
+          light: coolGray[600],
+          dark: gray[200],
+        },
+        'input-placeholder': {
+          light: coolGray[300],
+          dark: gray[400],
+        },
+        'input-border': {
+          light: coolGray[300],
+          dark: gray[500],
+        },
+        'input-label': {
+          light: coolGray[600],
+          dark: gray[200],
+        },
+        'input-border-hover': {
+          light: coolGray[400],
+          dark: gray[400],
+        },
+        'input-border-focus': {
+          light: brand[300],
+          dark: brand[300],
+        },
+
+        // ['brandColor']: '#7c3aed',
+        transparent: 'transparent',
+        current: 'currentColor',
+
+        black: '#000',
+        white: '#fff',
+
+        // gray: { ...gray },
+        // brand: { ...brand },
+        // blueGray: { ...blueGray },
+        // coolGray: { ...coolGray },
+
+        dark: {
+          100: '#eeeeee',
+          200: '#e0e0e0',
+          300: '#bbbbbb',
+          400: '#666666',
+          500: '#444444',
+          600: '#2a2a2a',
+          700: '#1f1f1f',
+          800: '#181818',
+          900: '#0f0f0f',
+        },
+
+        'secondary-text': {
+          light: '#71767F',
+          dark: '#878787',
+        },
+
+        // brand: {
+        //   50: '#82dab0',
+        //   100: '#82dab0',
+        //   200: '#69d3a0',
+        //   300: '#50cb90',
+        //   400: '#C5F1DD',
+        //   500: '#9FE7C7',
+        //   600: '#65D9A5',
+        //   700: '#3ECF8E',
+        //   800: '#24b47e', // green-500 in dashboard
+        //   900: '#2c9c6a',
+        // },
+
+        // ...custom_colors,
+      },
+
+      // transitionProperty: {
+      //   'max-height': 'max-height',
+      // },
+    },
+  },
+  plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography')],
+})
diff --git a/packages/common2/ui.config.js b/packages/common2/ui.config.js
new file mode 100644
index 00000000000..63219022ff1
--- /dev/null
+++ b/packages/common2/ui.config.js
@@ -0,0 +1,399 @@
+const deepMerge = require('deepmerge')
+const forms = require('@tailwindcss/forms')
+const plugin = require('tailwindcss/plugin')
+const radixUiColors = require('@radix-ui/colors')
+const brandColors = require('./default-colors')
+
+const { default: flattenColorPalette } = require('tailwindcss/lib/util/flattenColorPalette')
+
+// console.log(Object.keys(radixUiColors))
+
+// generates fixed scales
+// based on the root/light mode version
+const fixedOptions = ['scale', 'scaleA', 'brand']
+
+function radixColorKeys() {
+  let keys = Object.keys(radixUiColors)
+
+  /**
+   * Filter array items based on search criteria (query)
+   */
+  function filterItems(arr, query) {
+    return arr.filter(function (el) {
+      return el.toLowerCase().indexOf(query.toLowerCase()) == -1
+    })
+  }
+
+  keys = filterItems(keys, 'Dark')
+
+  // console.log('radixColorKeys', keys)
+  return keys
+}
+
+function generateColorClasses() {
+  const brandColors = ['brand', 'scale', 'scaleA']
+  const colors = [...radixColorKeys(), ...brandColors]
+
+  let mappedColors = {}
+
+  // generate the shape of the colors object
+  colors.map((x) => {
+    // create empty obj for each color
+    mappedColors[x] = {}
+    // create empty obj for each fixed color
+    if (
+      fixedOptions.some(function (v) {
+        return x.indexOf(v) >= 0
+      })
+    ) {
+      mappedColors[`${x}-fixed`] = {}
+    }
+  })
+
+  colors.map((x) => {
+    for (let index = 0; index < 12; index++) {
+      const step = index + 1
+      mappedColors[x][step * 100] = `var(--colors-${x.toLowerCase()}${step})`
+
+      if (
+        fixedOptions.some(function (v) {
+          return x.indexOf(v) >= 0
+        })
+      ) {
+        // console.log(x)
+        mappedColors[`${x}-fixed`][step * 100] = `var(--colors-fixed-${x}${step})`
+      }
+    }
+  })
+
+  return mappedColors
+}
+
+const colorClasses = generateColorClasses()
+
+/*
+ * generateCssVariables()
+ *
+ * generate the CSS variables for tailwind to use
+ *
+ */
+
+function generateCssVariables() {
+  // potential options
+  // { fixedOptions, brandColors }
+
+  let rootColors = {}
+  let darkColors = {}
+
+  const radixArray = Object.values(radixUiColors)
+  const brandArray = Object.values(brandColors)
+
+  function generateColors(colors, index, colorSet) {
+    const key = Object.keys(colorSet)[index]
+
+    if (key.includes('Dark')) {
+      darkColors = { ...darkColors, ...colors }
+    } else {
+      rootColors = { ...rootColors, ...colors }
+
+      // generate an optional 'fixed' scale of colors
+      if (
+        fixedOptions.some(function (v) {
+          return key.indexOf(v) >= 0
+        })
+      ) {
+        rootColors.fixed = { ...rootColors?.fixed, ...colors }
+      }
+    }
+  }
+
+  radixArray.map((x, i) => {
+    generateColors(x, i, radixUiColors)
+  })
+
+  brandArray.map((x, i) => {
+    generateColors(x, i, brandColors)
+  })
+
+  return {
+    root: { ...rootColors },
+    dark: { ...darkColors },
+  }
+}
+
+const variables = generateCssVariables()
+
+const uiConfig = {
+  theme: {
+    variables: {
+      DEFAULT: {
+        width: {
+          listbox: '320px',
+        },
+        colors: { ...variables.root },
+      },
+      '.dark': {
+        colors: { ...variables.dark },
+      },
+    },
+    extend: {
+      // dropdown extensions
+      transformOrigin: {
+        // tailwind class for this is `origin-dropdown`
+        dropdown: 'var(--radix-dropdown-menu-content-transform-origin)',
+        popover: 'var(--radix-popover-menu-content-transform-origin);',
+      },
+      width: {
+        listbox: 'var(--width-listbox);',
+      },
+      keyframes: {
+        fadeIn: {
+          '0%': { transform: 'scale(0.95)', opacity: 0 },
+          '100%': { transform: 'scale(1)', opacity: 1 },
+        },
+        fadeOut: {
+          '0%': { transform: 'scale(1)', opacity: 1 },
+          '100%': { transform: 'scale(0.95)', opacity: 0 },
+        },
+        overlayContentShow: {
+          '0%': { opacity: 0, transform: 'translate(0%, -2%) scale(.96)' },
+          '100%': { opacity: 1, transform: 'translate(0%, 0%) scale(1)' },
+        },
+        overlayContentHide: {
+          '0%': { opacity: 1, transform: 'translate(0%, 0%) scale(1)' },
+          '100%': { opacity: 0, transform: 'translate(0%, -2%) scale(.96)' },
+        },
+        dropdownFadeIn: {
+          '0%': { transform: 'scale(0.95)', opacity: 0 },
+          '100%': { transform: 'scale(1)', opacity: 1 },
+        },
+        dropdownFadeOut: {
+          '0%': { transform: 'scale(1)', opacity: 1 },
+          '100%': { transform: 'scale(0.95)', opacity: 0 },
+        },
+        fadeInOverlayBg: {
+          '0%': { opacity: 0 },
+          '100%': { opacity: 0.75 },
+        },
+        fadeOutOverlayBg: {
+          '0%': { opacity: 0.75 },
+          '100%': { opacity: 0 },
+        },
+        slideDown: {
+          '0%': { height: 0, opacity: 0 },
+          '100%': {
+            height: 'var(--radix-accordion-content-height)',
+            opacity: 1,
+          },
+        },
+        slideUp: {
+          '0%': { height: 'var(--radix-accordion-content-height)', opacity: 1 },
+          '100%': { height: 0, opacity: 0 },
+        },
+
+        slideDownNormal: {
+          '0%': { height: 0, opacity: 0 },
+          '100%': {
+            height: 'inherit',
+            opacity: 1,
+          },
+        },
+        slideUpNormal: {
+          '0%': { height: 'inherit', opacity: 1 },
+          '100%': { height: 0, opacity: 0 },
+        },
+
+        panelSlideLeftOut: {
+          '0%': { transform: 'translateX(-100%)', opacity: 0 },
+          '100%': {
+            transform: 'translate-x-0',
+            opacity: 1,
+          },
+        },
+        panelSlideLeftIn: {
+          '0%': { transform: 'translate-x-0', opacity: 1 },
+          '100%': { transform: 'translateX(-100%)', opacity: 0 },
+        },
+        panelSlideRightOut: {
+          '0%': { transform: 'translateX(100%)', opacity: 0 },
+          '100%': {
+            transform: 'translate-x-0',
+            opacity: 1,
+          },
+        },
+        panelSlideRightIn: {
+          '0%': { transform: 'translate-x-0', opacity: 1 },
+          '100%': { transform: 'translateX(100%)', opacity: 0 },
+        },
+      },
+      animation: {
+        'fade-in': 'fadeIn 300ms',
+        'fade-out': 'fadeOut 300ms',
+
+        'dropdown-content-show': 'overlayContentShow 100ms cubic-bezier(0.16, 1, 0.3, 1)',
+        'dropdown-content-hide': 'overlayContentHide 100ms cubic-bezier(0.16, 1, 0.3, 1)',
+
+        'overlay-show': 'overlayContentShow 300ms cubic-bezier(0.16, 1, 0.3, 1)',
+        'overlay-hide': 'overlayContentHide 300ms cubic-bezier(0.16, 1, 0.3, 1)',
+
+        'fade-in-overlay-bg': 'fadeInOverlayBg 300ms',
+        'fade-out-overlay-bg': 'fadeOutOverlayBg 300ms',
+
+        'slide-down': 'slideDown 300ms cubic-bezier(0.87, 0, 0.13, 1)',
+        'slide-up': 'slideUp 300ms cubic-bezier(0.87, 0, 0.13, 1)',
+
+        'slide-down-normal': 'slideDownNormal 300ms cubic-bezier(0.87, 0, 0.13, 1)',
+        'slide-up-normal': 'slideUpNormal 300ms cubic-bezier(0.87, 0, 0.13, 1)',
+
+        'panel-slide-left-out': 'panelSlideLeftOut 200ms cubic-bezier(0.87, 0, 0.13, 1)',
+        'panel-slide-left-in': 'panelSlideLeftIn 250ms cubic-bezier(0.87, 0, 0.13, 1)',
+        'panel-slide-right-out': 'panelSlideRightOut 200ms cubic-bezier(0.87, 0, 0.13, 1)',
+        'panel-slide-right-in': 'panelSlideRightIn 250ms cubic-bezier(0.87, 0, 0.13, 1)',
+
+        // tailwind class for this is `animate-dropdownFadeIn`
+        dropdownFadeIn: 'dropdownFadeIn 0.1s ease-out',
+        // tailwind class for this is `animate-dropdownFadeOut`
+        dropdownFadeOut: 'dropdownFadeOut 0.1s ease-out',
+      },
+      colors: {
+        ...colorClasses,
+        'hi-contrast': `var(--colors-fixed-scale12)`,
+        'lo-contrast': `var(--colors-fixed-scale1)`,
+      },
+    },
+  },
+  plugins: [
+    require('@mertasan/tailwindcss-variables'),
+    function ({ addUtilities, addVariant }) {
+      // addVariant('data-open', '&:[data-state=open]')
+      addUtilities({
+        ".dropdown-content[data-state='open']": {
+          animation: 'fadeIn 50ms ease-out',
+        },
+        ".dropdown-content[data-state='closed']": {
+          animation: 'fadeOut 50ms ease-in',
+        },
+
+        "[data-state='open'] .accordion-content-animation": {
+          animation: 'slideDown 200ms ease-out',
+        },
+        "[data-state='closed'] .accordion-content-animation": {
+          animation: 'slideUp 200ms ease-in',
+        },
+        '.text-code': {
+          margin: '0 0.2em',
+          padding: '0.2em 0.4em 0.1em',
+          background: 'hsla(0, 0%, 58.8%, 0.1)',
+          border: '1px solid hsla(0, 0%, 39.2%, 0.2)',
+          borderRadius: '3px',
+        },
+        '.no-scrollbar': {
+          /* Hide scrollbar for IE, Edge*/
+          '-ms-overflow-style': 'none',
+
+          /* Firefox */
+          'scrollbar-width': 'none' /* Firefox */,
+
+          /* Hide scrollbar for Chrome, Safari and Opera */
+          '&::-webkit-scrollbar': {
+            display: 'none',
+          },
+        },
+        /* Add fadeout effect */
+        '.mask-fadeout-right': {
+          '-webkit-mask-image': 'linear-gradient(to right, white 98%, transparent 100%)',
+          'mask-image': 'linear-gradient(to right, white 98%, transparent 100%)',
+        },
+        '.mask-fadeout-left': {
+          '-webkit-mask-image': 'linear-gradient(to left, white 98%, transparent 100%)',
+          'mask-image': 'linear-gradient(to left, white 98%, transparent 100%)',
+        },
+        'input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button':
+          {
+            '-webkit-appearance': 'none',
+            margin: '0',
+          },
+      })
+      addVariant('data-open-parent', '[data-state="open"] &')
+      addVariant('data-closed-parent', '[data-state="closed"] &')
+      addVariant('data-open', '&[data-state="open"]')
+      addVariant('data-closed', '&[data-state="closed"]')
+      addVariant('data-show', '&[data-state="show"]')
+      addVariant('data-hide', '&[data-state="hide"]')
+      addVariant('data-checked', '&[data-state="checked"]')
+      addVariant('data-unchecked', '&[data-state="unchecked"]')
+      addVariant('aria-expanded', '&[aria-expanded="true"]')
+      // addVariant('parent-data-open', '[data-state="open"]&')
+    },
+    function ({ matchUtilities, theme }) {
+      matchUtilities(
+        {
+          highlight: (value) => ({ boxShadow: `inset 0 1px 0 0 ${value}` }),
+        },
+        { values: flattenColorPalette(theme('backgroundColor')), type: 'color' }
+      ),
+        matchUtilities(
+          {
+            subhighlight: (value) => ({
+              boxShadow: `inset 0 -1px 0 0 ${value}`,
+            }),
+          },
+          {
+            values: flattenColorPalette(theme('backgroundColor')),
+            type: 'color',
+          }
+        ),
+        matchUtilities(
+          {
+            bordershadow: (value) => {
+              return {
+                boxShadow: `
+                var(--colors-blacka1) 0px 0px 0px 0px, 
+                var(--colors-blacka1) 0px 0px 0px 0px, 
+                var(--colors-blacka8) 0px 1px 1px 0px, 
+                ${value} 0px 0px 0px 1px, 
+                var(--colors-blacka1) 0px 0px 0px 0px, 
+                var(--colors-blacka1) 0px 0px 0px 0px, 
+                rgb(64 68 82 / 8%) 0px 2px 5px 0px;
+                `,
+              }
+            },
+          },
+          {
+            values: flattenColorPalette(theme('backgroundColor')),
+            type: 'color',
+          }
+        )
+    },
+    require('tailwindcss-radix')(),
+    forms,
+  ],
+}
+
+function arrayMergeFn(destinationArray, sourceArray) {
+  return destinationArray.concat(sourceArray).reduce((acc, cur) => {
+    if (acc.includes(cur)) return acc
+    return [...acc, cur]
+  }, [])
+}
+
+/**
+ * Merge Supabase UI and Tailwind CSS configurations
+ * @param {object} tailwindConfig - Tailwind config object
+ * @return {object} new config object
+ */
+function wrapper(tailwindConfig) {
+  let purge
+  if (Array.isArray(tailwindConfig.purge)) {
+    purge = {
+      content: tailwindConfig.purge,
+    }
+  } else {
+    purge = tailwindConfig.purge
+  }
+  return deepMerge({ ...tailwindConfig, purge }, uiConfig, {
+    arrayMerge: arrayMergeFn,
+  })
+}
+
+module.exports = wrapper
diff --git a/studio/tailwind.config.js b/studio/tailwind.config.js
index e961bfa6b9b..8005b70e977 100644
--- a/studio/tailwind.config.js
+++ b/studio/tailwind.config.js
@@ -1,4 +1,4 @@
-const ui = require('@supabase/ui/dist/config/ui.config.js')
+const ui = require('config/ui.config.js')
 
 // const gray = {
 //   100: '#eeeeee',
@@ -59,11 +59,12 @@ module.exports = ui({
     './internals/**/*.{js,ts,jsx,tsx}',
     './lib/**/*.{js,ts,jsx,tsx}',
     './lib/**/**/*.{js,ts,jsx,tsx}',
+    './../packages/ui/src/lib/theme/defaultTheme.ts',
     // purge styles from supabase ui theme
-    './node_modules/@supabase/ui/dist/config/default-theme.js',
+    // './node_modules/@supabase/ui/dist/config/default-theme.js',
     // purge styles from grid library
-    './node_modules/@supabase/grid/src/components/**/*.{js,ts,jsx,tsx}',
-    './node_modules/@supabase/grid/src/components/**/**/*.{js,ts,jsx,tsx}',
+    // './node_modules/@supabase/grid/src/components/**/*.{js,ts,jsx,tsx}',
+    // './node_modules/@supabase/grid/src/components/**/**/*.{js,ts,jsx,tsx}',
   ],
   theme: {
     // maxHeight: {