tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
  theme: {
    extend: {
      colors: {
        primary100: "#D7DBFF",
        primary300: "#3B28CC",
        primary500: "#322E9C",
        white: "#FFFFFF",
        white100: "#F1F1F1",
        white300: "#F2F2F2",
        grey: "#D7D7D7",
        grey100: "#A4A7C6",
        black: "#000000",
        black100: "#1E1E1E",
      },
      fontSize: {
        xs: "1.0rem",
        sm: "1.2rem",
        base: "1.4rem",
        md: "1.6rem",
        lg: "1.8rem",
        xl: "2rem",
        ["2xl"]: "2.4rem",
      },
      spacing: {
        0.5: "0.2rem",
        1: "0.4rem",
        1.5: "0.6rem",
        2: "0.8rem",
        2.5: "1rem",
        3: "1.2rem",
        3.5: "1.4rem",
        4: "1.6rem",
        5: "2rem",
        6: "2.4rem",
        7: "2.8rem",
        8: "3.2rem",
        9: "3.6rem",
        10: "4.0rem",
      },
      borderRadius: {
        sm: "0.4rem",
        DEFAULT: "0.8rem",
        md: "1.2rem",
        lg: "1.8rem",
        xl: "2.4rem",
        ["2xl"]: "4.0rem",
      },
    },
  },
  plugins: [],
};