diff --git a/platform/ui/tailwind.config.js b/platform/ui/tailwind.config.js
index c2c57b58f..991c43895 100644
--- a/platform/ui/tailwind.config.js
+++ b/platform/ui/tailwind.config.js
@@ -25,7 +25,6 @@ module.exports = {
         light: '#a2a0af',
         main: '#333',
         dark: '#000',
-        // Previously '' (empty string)
         contrastText: '#fff',
       },
 
@@ -154,7 +153,7 @@ module.exports = {
     spacing: {
       px: '1px',
       '0': '0',
-      '1': '0.25rem',
+      '1': '0.15rem',
       '2': '0.5rem',
       '3': '0.75rem',
       '4': '1rem',
@@ -278,9 +277,9 @@ module.exports = {
       ],
     },
     fontSize: {
-      xs: '0.75rem',
-      sm: '0.875rem',
-      base: '1rem',
+      xs: '0.65rem',
+      sm: '0.75rem',
+      base: '0.875rem',
       lg: '1.125rem',
       xl: '1.25rem',
       '2xl': '1.5rem',
@@ -385,9 +384,25 @@ module.exports = {
     },
     opacity: {
       '0': '0',
-      '25': '0.25',
-      '50': '0.5',
-      '75': '0.75',
+      '5': '.5',
+      '10': '.10',
+      '15': '.15',
+      '20': '.20',
+      '25': '.25',
+      '30': '.30',
+      '35': '.35',
+      '40': '.40',
+      '45': '.45',
+      '50': '.50',
+      '55': '.55',
+      '60': '.60',
+      '65': '.65',
+      '70': '.70',
+      '75': '.75',
+      '80': '.80',
+      '85': '.85',
+      '90': '.90',
+      '95': '.95',
       '100': '1',
     },
     order: {
@@ -643,15 +658,15 @@ module.exports = {
     alignSelf: ['responsive'],
     appearance: ['responsive'],
     backgroundAttachment: ['responsive'],
-    backgroundColor: ['responsive', 'hover', 'focus'],
+    backgroundColor: ['responsive', 'hover', 'focus', 'active'],
     backgroundPosition: ['responsive'],
     backgroundRepeat: ['responsive'],
     backgroundSize: ['responsive'],
     borderCollapse: ['responsive'],
-    borderColor: ['responsive', 'hover', 'focus'],
-    borderRadius: ['responsive'],
-    borderStyle: ['responsive'],
-    borderWidth: ['responsive'],
+    borderColor: ['responsive', 'hover', 'focus', 'active'],
+    borderRadius: ['responsive', 'focus'],
+    borderStyle: ['responsive', 'focus'],
+    borderWidth: ['responsive', 'focus'],
     boxShadow: ['responsive', 'hover', 'focus'],
     boxSizing: ['responsive'],
     cursor: ['responsive'],
@@ -683,7 +698,7 @@ module.exports = {
     minWidth: ['responsive'],
     objectFit: ['responsive'],
     objectPosition: ['responsive'],
-    opacity: ['responsive', 'hover', 'focus'],
+    opacity: ['responsive', 'hover', 'focus', 'active'],
     order: ['responsive'],
     outline: ['responsive', 'focus'],
     overflow: ['responsive'],
@@ -696,7 +711,7 @@ module.exports = {
     strokeWidth: ['responsive'],
     tableLayout: ['responsive'],
     textAlign: ['responsive'],
-    textColor: ['responsive', 'hover', 'focus'],
+    textColor: ['responsive', 'hover', 'focus', 'active'],
     textDecoration: ['responsive', 'hover', 'focus'],
     textTransform: ['responsive'],
     userSelect: ['responsive'],