refact: update ui

tailwind.config.js

@@ -2,7 +2,51 @@
 export default {
   content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
   theme: {
-    extend: {},
+    extend: {
+      colors: {
+        coral: {
+          50: '#fef0ec',
+          100: '#fdddd5',
+          200: '#fbb9ab',
+          300: '#f48e78',
+          400: '#e86f54',
+          500: '#e05a33',
+          600: '#c94a28',
+          700: '#a53d22',
+          800: '#84331e',
+          900: '#6c2c1c',
+        },
+        ink: {
+          DEFAULT: '#1c1917',
+          secondary: '#57534e',
+          muted: '#a8a29e',
+        },
+        cream: {
+          50: '#fdfcfa',
+          100: '#faf8f4',
+          200: '#f5f3ee',
+          300: '#e7e5e4',
+        },
+        sage: {
+          50: '#eef9f7',
+          100: '#d5f0eb',
+          200: '#aee0d7',
+          300: '#7ccbbe',
+          400: '#4db3a4',
+          500: '#2a9d8f',
+          600: '#1f7d72',
+          700: '#1c655d',
+        },
+      },
+      fontFamily: {
+        display: ['"Plus Jakarta Sans"', 'system-ui', 'sans-serif'],
+        body: ['"DM Sans"', 'system-ui', 'sans-serif'],
+      },
+      borderRadius: {
+        '2xl': '1rem',
+        '3xl': '1.25rem',
+      },
+    },
   },
   plugins: [
     require('@tailwindcss/typography'),