tailwind.config.js

module.exports = {
  purge: ["./pages/**/*.{js,jsx,ts,tsx}", "./components/**/*.{js,jsx,ts,tsx}"], //,"./public/index.html"],
  theme: {
    colors: {
      mainbg: "#0e0f1f",
      "mainbg-hover": "#15162e",
      red: "rgb(210, 38, 38)",
      asidebg: "#1b112b",
      "asidebg-hover": "#27193e",
      inputbg: "#231a2b",
      "inputbg-focus": "#120d16", // "#1a1320",
      "inputbg-hover": "#2f2239",
      mupurple: "#9b50ff",
      gray: "#706C61",
      black: "#000",
      "mupurple-hover": "#892eff",
      "mupurple-active": "#6e00ff",
      phantasmablue: "#17b1e8",
      "phantasmablue-hover": "#149bcc",
      kcalred: "#cf0000",
      white: "#f2f2f2",
      "white-hover": "#ddd",
      "white-active": "#cdcdcd",
      success: "#577c48",
      secondary: "#a58eb9",
      "secondary-hover": "#b4a1c4",
      metamask: {
        bg: "#081828",
        "bg-hover": "#0d2944",
        text: "#efeff0",
        "text-hover": "#f7f7f8",
      },
      highlightbg: "#1D0C1A",
      twitter: "#1da1f2",
      "twitter-hover": "#0d91e3",
      explanation1: "#080310",
      explanation2: "#3f2255",

      // purple: {
      //   100: "#230026",
      //   200: "#311457",
      //   300: "#452057",
      //   400: "#6004db",
      //   700: "#9b50ff",
      // },
      // blue: {
      //   100: "#190e37",
      // },
      // cyan: "#17b1e8",
      // indigo: {
      //   100: "#dde5da",
      //   200: "#bccbb6",
      //   300: "#9ab091",
      //   400: "#79966d",
      //   500: "#577c48",
      //   600: "#46633a",
      //   700: "#344a2b",
      //   800: "#23321d",
      //   900: "#11190e",
      // },
      extend: {},
    },

    screens: {
      tiny: "355px",
      xs: "442px",
      sm: "673px",
      md: "768px",
      mdish: "850px",
      lg: "1024px",
      lgish: "1124px",
      xl: "1248px",
      xlish: "1281px",
      "2xl": "1536px",
    },
    fontFamily: {
      title: ["Montserrat"],
      body: ["Open Sans"],
    },
    extend: {
      backgroundImage: (theme) => ({
        "memeunity-banner": "url('/images/memeunity-banner.jpg')",
      }),
    },
  },
  darkMode: false, // or 'media' or 'class'
  variants: {
    extend: {
      backgroundColor: ["active"],
    },
  },
  plugins: [],
};