tailwind.config.js

/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    colors: {
      'white': '#fff',
      'primary': {
        '50': '#efeeff',
        '100': '#e2e0ff',
        '200': '#cac7fe',
        '300': '#aaa5fc',
        '400': '#8881f8',
        '500': '#6b63f1',
        '600': '#4f46e5',
        '700': '#4038ca',
        '800': '#3730a3',
        '900': '#332e81',
        '950': '#1e1b4b',
      },
      'danger': {
        '50': '#fef2f2',
        '100': '#fee2e2',
        '200': '#ffc9c9',
        '300': '#fda4a4',
        '400': '#fa6f6f',
        '500': '#f14242',
        '600': '#e02d2d',
        '700': '#bb1a1a',
        '800': '#9b1919',
        '900': '#801c1c',
        '950': '#460909',
      },
      'success': {
        '50': '#e8ffe5',
        '100': '#caffc7',
        '200': '#99ff95',
        '300': '#5afe58',
        '400': '#31f531',
        '500': '#07db0b',
        '600': '#01af07',
        '700': '#06850d',
        '800': '#0b6910',
        '900': '#0f5815',
        '950': '#023107',
      },
      'warning': {
        '50': '#fef8ec',
        '100': '#faedcb',
        '200': '#f5d892',
        '300': '#f0bf59',
        '400': '#eba42a',
        '500': '#e5881b',
        '600': '#ca6615',
        '700': '#a84815',
        '800': '#893817',
        '900': '#712f16',
        '950': '#401608',
      },
      'black': {
        '50': '#f7f7f7',
        '100': '#e3e3e3',
        '200': '#c8c8c8',
        '300': '#a4a4a4',
        '400': '#818181',
        '500': '#666666',
        '600': '#515151',
        '700': '#434343',
        '800': '#383838',
        '900': '#313131',
        '950': '#000000',
      },
      'slate': {
        '50': '#f4f6f7',
        '100': '#e2e6eb',
        '200': '#c9cfd8',
        '300': '#a3aebd',
        '400': '#76859a',
        '500': '#64748b',
        '600': '#4e596c',
        '700': '#444b5a',
        '800': '#3d424d',
        '900': '#363a43',
        '950': '#21242b',
      },
      'gray': {
        '100': '#f5f7fa',
        '200': '#eaeef4',
        '300': '#d0dbe7',
        '400': '#7799b9',
        '500': '#37506d',
        '600': '#1F2937',
      },
    },
    boxShadow: {
      "custom": "rgba(50, 50, 105, 0.1) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px",
    },
    extend: {},
  },
  plugins: [],
}