tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./src/**/*.{html,js}', './index.html'],
  theme: {
    extend: {
      backgroundImage: {
        'hero-image': "url('')",
      },
      screens: {
        'phone': '400px',
        'tablet': '1009px',
        'tablet2': '1298px',
      },
      fontFamily: {
        'agrandir-wide': ['AGRANDIR', 'sans-serif'],
        'poppins': ['Poppins'],
      },
      colors: {
        primary: '#D2C4A8',
        secondary: '#FFF1DB',
        asset: '#F3F3F3',
        asset2: '#FFEAC2',
        success: '#2ECC71',
        danger: '#E74C3C',
        warning: '#E67E22',
        info: '#34495E',
        light: '#F1C40F',
        dark: '#2C3E50',
      },
      width: {
        '500': '500px',
      },
      height: {
        '84': '84px',
        '90': '90px',
        '100': '100px',
        '120': '120px',
        '200': '200px',
        '350': '350px',
        '400': '400px',
        '450': '450px',
        '500': '500px',
        '600': '600px',
        '700': '700px',
        '800': '800px',
        '850': '850px',
        '900': '900px',
      },
      margin: {
        '20': '20px',
        '30': '30px',
        '40': '40px',
        '50': '50px',
        '60': '60px',
        '70': '70px',
        '80': '80px',
        '90': '90px',
        '100': '100px',
        '200': '200px',
        '300': '300px',
        '350': '350px',
        '400': '400px',
        '500': '500px',
        '600': '600px',
        '670': '670px',
        '900': '900px',
      },
      padding: {
        '20': '20px',
        '30': '30px',
        '40': '40px',
        '50': '50px',
        '60': '60px',
        '70': '70px',
        '80': '80px',
        '90': '90px',
        '100': '100px',
        '200': '200px',
        '300': '300px',
        '350': '350px',
        '400': '400px',
        '500': '500px',
        '600': '600px',
        '670': '670px',
        '900': '900px',
      }
    },
  },
  plugins: [],
}