tailwind.config.js

module.exports = {
  theme: {
    extend: {
      colors: {
        primary: {
          "100": "#e6fffa",
          "200": "#b3feef",
          "300": "#81fde4",
          "400": "#4ffdda",
          "500": "#1cfccf",
          "600": "#03e3b6",
          "700": "#02b08d",
          "800": "#027e65",
          "900": "#014c3d",
        },
        secondary: {
          "100": "#e8fcfc",
          "200": "#bbf7f6",
          "300": "#8df1ef",
          "400": "#60ece9",
          "500": "#32e6e3",
          "600": "#19cdc9",
          "700": "#139f9d",
          "800": "#0e7270",
          "900": "#084443",
        },
        tertiary: {
          "100": "#e6fffa",
          "200": "#b3feef",
          "300": "#81fee5",
          "400": "#4efeda",
          "500": "#1bfdd0",
          "600": "#02e4b6",
          "700": "#01b18e",
          "800": "#017e65",
          "900": "#014c3d",
        },
      },
      height: {
        "5/10": "50vh",
        "6/10": "60vh",
        "7/10": "70vh",
        "8/10": "80vh",
        "11/12": "91.666667%",
      },
      minHeight: {
        "10/12": "83.333333%",
        "11/12": "91.666667%",
      },
      width: {
        "6/10": "60vw",
        "7/10": "70vw",
        "8/10": "80vw",
        "9/10": "90vw",
        "10/12": "83.333333%",
        "11/12": "91.666667%",
      },
      maxWidth: {
        "10/12": "83.333333%",
        "11/12": "91.666667%",
      },
      margin: {
        "72": "18rem",
      },
    },
  },
};