text: module.exports = {
    mode: "jit",
    theme: {
      screens: {
        sm: { max: "600px" },
      },
      colors: {
        primary: {
          purple: {
            DEFAULT: "#9142FF",
            dark: "#740FFF",
            light: "#AF75FF",
          },
        },
        neutral: {
          white: {
            DEFAULT: "#FFFFFF",
          },
          gray: {
            1: "#F6F5F9",
            2: "#E8E7F1",
            3: "#DAD9E3",
            4: "#BEBDCE",
            5: "#D0CFE2",
            6: "#7E7B9D",
            7: "#77739C",
          },
          blue: {
            DEFAULT: "#1E1856",
            dark: "#0A0631",
            light: "#403B6F",
          },
        },
        brand: {
          blue: {
            light: "#E5F6FE",
          },
        },
      },
      extend: {
        spacing: {
          screen: "100vw",
          full: "100%",
          px: "1px",
          0: "0",
          2: "2px",
          3: "3px",
          4: "4px",
          5: "5px",
          6: "6px",
          7: "7px",
          8: "8px",
          9: "9px",
          10: "10px",
          11: "11px",
          12: "12px",
          14: "14px",
          16: "16px",
          20: "20px",
          24: "24px",
          28: "28px",
          32: "32px",
          36: "36px",
          40: "40px",
          44: "44px",
          48: "48px",
          52: "52px",
          56: "56px",
          60: "60px",
          64: "64px",
          72: "72px",
          80: "80px",
          96: "96px",
          112: "112px",
          600: "600px",
          "1/2": "50%",
          "1/3": "33.333333%",
          "2/3": "66.666667%",
          "1/4": "25%",
          "2/4": "50%",
          "3/4": "75%",
          "1/5": "20%",
          "2/5": "40%",
          "3/5": "60%",
          "4/5": "80%",
          "1/6": "16.666667%",
          "2/6": "33.333333%",
          "3/6": "50%",
          "4/6": "66.666667%",
          "5/6": "83.333333%",
          "1/12": "8.333333%",
          "2/12": "16.666667%",
          "3/12": "25%",
          "4/12": "33.333333%",
          "5/12": "41.666667%",
          "6/12": "50%",
          "7/12": "58.333333%",
          "8/12": "66.666667%",
          "9/12": "75%",
          "10/12": "83.333333%",
          "11/12": "91.666667%",
        },
        borderRadius: {
          none: "0px",
          sm: "2px",
          DEFAULT: "4px",
          md: "6px",
          lg: "8px",
          xl: "12px",
          "2xl": "16px",
          "3xl": "24px",
          full: "9999px",
        },
        fontFamily: {
          roboto: ["roboto", "sans-serif"],
          sans: [
            "ui-sans-serif",
            "system-ui",
            "-apple-system",
            '"Segoe UI"',
            "sans-serif",
          ],
          serif: [
            "ui-serif",
            "Georgia",
            "Cambria",
            '"Times New Roman"',
            "Times",
            "serif",
          ],
          mono: ["ui-monospace", "Menlo", "Consolas", "monospace"],
        },
        fontSize: {
          0: "0",
          xs: "12px",
          sm: "14px",
          base: "16px",
          lg: "18px",
          xl: "20px",
          "2xl": "24px",
          "3xl": "30px",
          "4xl": "36px",
          "5xl": "48px",
          "6xl": "60px",
          "7xl": "72px",
          "8xl": "96px",
          "9xl": "128px",
        },
        inset: (theme) => ({
          ...theme("spacing"),
        }),
        letterSpacing: (theme) => ({
          ...theme("spacing"),
        }),
        lineHeight: (theme) => ({
          ...theme("spacing"),
        }),
        maxHeight: (theme) => ({
          ...theme("spacing"),
        }),
        maxWidth: (theme) => ({
          ...theme("spacing"),
          xs: "160px",
          sm: "192px",
          md: "224px",
          lg: "256px",
          xl: "288px",
          "2xl": "336px",
          "3xl": "384px",
          "4xl": "448px",
          "5xl": "512px",
          "6xl": "576px",
          "7xl": "640px",
        }),
        minHeight: (theme) => ({
          ...theme("spacing"),
        }),
        minWidth: (theme) => ({
          ...theme("spacing"),
        }),
      },
    },
    corePlugins: {
      animation: false,
      backgroundOpacity: false,
      borderOpacity: false,
      divideOpacity: false,
      placeholderOpacity: false,
      textOpacity: false,
    },
  };
  