tailwind.config.js

module.exports = {
  theme: {
    fontFamily: {
      body: ['Avenir', 'sans-serif'],
    },
    extend: {
      height: {
        '100': '100px',
        '200': '200px',
        '300': '300px',
        '400': '400px',
        '500': '500px',
        '600': '600px',
        '700': '700px',
        '800': '800px',
      },
      spacing: {
        '72': '18rem',
        '84': '21rem',
        '96': '24rem',
        '108': '30rem',
        '112': '32rem',
        '120': '36rem',
      },
      minHeight: {
        '0': '0',
        '1': '100px',
        '2': '200px',
        '3': '300px',
        '4': '400px',
        '5': '500px',
        '6': '600px',
        '7': '700px',
        '8': '800px',
        '1/4': '25%',
        '1/2': '50%',
        '3/4': '75%',
        'full': '100%',
      },
      maxHeight: {
        '0': '0',
        '1': '100px',
        '2': '200px',
        '3': '300px',
        '4': '400px',
        '5': '500px',
        '6': '600px',
        '7': '700px',
        '8': '800px',
        '1/4': '25%',
        '1/2': '50%',
        '3/4': '75%',
        'full': '100%',
      },
    },
  },
  variants: {
    margin: ['responsive', 'last'],
    maxHeight: ['responsive', 'hover', 'focus'],
  },
};