tailwind.config.js

// tailwind.config.js
// eslint-disable-next-line @typescript-eslint/no-var-requires
const colors = require('tailwindcss/colors')
// eslint-disable-next-line @typescript-eslint/no-var-requires
module.exports = {
  future: {
    // removeDeprecatedGapUtilities: true,
    // purgeLayersByDefault: true,
  },
  purge: [],
  theme: {
    colors: {
      white: '#FFFFFF',
      black: '#000000',
      primary: {
        50: '#F3FAFE',
        100: '#E6F6FE',
        200: '#C1E8FC',
        300: '#9CDBFA',
        400: '#51BFF6',
        500: '#07A4F2',
        600: '#0694DA',
        700: '#046291',
        800: '#034A6D',
        900: '#023149',
      },
      secondary: {
        50: '#F9FDFF',
        100: '#F4FBFE',
        200: '#E3F5FD',
        300: '#D2EEFC',
        400: '#B1E2F9',
        500: '#8FD5F7',
        600: '#81C0DE',
        700: '#568094',
        800: '#40606F',
        900: '#2B404A',
      },
      light: {
        50: '#FEFEFE',
        100: '#FEFEFE',
        200: '#FBFBFB',
        300: '#F9F9F9',
        400: '#F5F5F5',
        500: '#F0F0F0',
        600: '#D8D8D8',
        700: '#909090',
        800: '#6C6C6C',
        900: '#484848',
      },
      dark: {
        50: '#F7F9FA',
        100: '#EFF3F4',
        200: '#D7E0E4',
        300: '#BECDD4',
        400: '#8EA8B4',
        500: '#5D8294',
        600: '#547585',
        700: '#384E59',
        800: '#2A3B43',
        900: '#1C272C',
      },
      red: colors.red,
    },
    screens: {
      xs: { max: '639px' },
      sm: { min: '640px' },
      md: { min: '768px' },
      lg: { min: '1024px' },
      xl: { min: '1280px' },
    },
    extend: {},
  },
  variants: {},
  plugins: [],
}