feat: select theme

tailwind.config.ts

@@ -2,6 +2,7 @@ import { type Config } from "tailwindcss";
 
 export default {
   content: ["./src/**/*.tsx"],
+  darkMode: 'class',
   theme: {
     extend: {
       fontFamily: {
@@ -10,6 +11,9 @@ export default {
       fontSize: {
         sm: "0.8rem",
       },
+      boxShadow: {
+        '3xl': '0px 16px 70px rgba(0, 0, 0, 0.5)',
+      },
       colors: {
         "dark-50": "#161616",
         "dark-100": "#1c1c1c",
@@ -23,6 +27,17 @@ export default {
         "dark-900": "#7e7e7e",
         "dark-950": "#bbb",
         "dark-1000": "#ededed",
+        "light-50": "hsl(0deg 0% 98.8%)",
+        "light-100": "hsl(0deg 0% 97.3%)",
+        "light-200": "hsl(0deg 0% 95.3%)",
+        "light-300": "hsl(0deg 0% 92.9%)",
+        "light-400": "hsl(0deg 0% 91%)",
+        "light-500": "hsl(0deg 0% 88.6%)",
+        "light-700": "hsl(0deg 0% 85.9%)",
+        "light-800": "hsl(0deg 0% 78%)",
+        "light-900": "hsl(0deg 0% 56.1%)",
+        "light-950": "hsl(0deg 0% 52.2%)",
+        "light-1000": "hsl(0deg 0% 43.5%)",
       },
       screens: {
         xxl: '1600px'