index.js

const fontFamilySans = [
    'ui-sans-serif',
    'system-ui',
    '-apple-system',
    'BlinkMacSystemFont',
    '"Segoe UI"',
    'Roboto',
    '"Helvetica Neue"',
    'Arial',
    '"Noto Sans"',
    'sans-serif',
    '"Apple Color Emoji"',
    '"Segoe UI Emoji"',
    '"Segoe UI Symbol"',
    '"Noto Color Emoji"',
  ];
  const tailwindConfig = {
    content: ['./src/**/*.{js,jsx,ts,tsx}'],
    corePlugins: {
      preflight: false,
    },
    theme: {
      fontFamily: {
        inter: ['"Inter"', ...fontFamilySans],
      },
      screens: {
        // devLake sm断点
        'sm': { 'max': '1024px' },
        'mobile': { 'max': '550px' },
        // devStream sm断点
        'sm2': '640px',
        'md': '768px',
        'lg': '1024px',
        'xl': '1280px',
        '2xl': '1536px',
      },
      spacing: {
        1: '8px',
        2: '12px',
        3: '16px',
        4: '24px',
        5: '32px',
        6: '48px',
        7: '64px',
        8: '80px',
        9: '96px',
        10: '112px',
        11: '128px',
      },
      extend: {
        colors: {
          primary: '#7497F7',
          'primary-light': '#99B3F9',
          'primary-100': '#F0F4FE',
          'primary-200': '#DBE4FD',
          'primary-300': '#BDCEFB',
          'primary-500': '#7497F7',
          'primary-800': '#3C5088',
          neutral: {
            invert: '#FFFFFF',
            300: '#94959F',
            400: '#70727F',
            500: '#4D4E5F',
            600: '#292B3F',
          },
          secondary: {
            500: "#FF8B8B",
          }
        },
        fontSize: {
          // devlake
          heading0: ['48px', { lineHeight: '64px' }],
          heading1: ['32px', { lineHeight: '40px' }],
          heading2: ['24px', { lineHeight: '30px' }],
          heading3: ['20px', { lineHeight: '25px' }],
          heading4: ['16px', { lineHeight: '20px' }],
          label14: ['14px', { lineHeight: '20px' }],
          label16: ['16px', { lineHeight: '24px' }],
          label18: ['18px', { lineHeight: '24px' }],
          label24: ['24px', { lineHeight: '32px' }],
          // devstream
          heading1stream: ['32px', { lineHeight: 1.25 }],
          heading2stream: ['24px', { lineHeight: 1.25 }],
          heading3stream: ['20px', { lineHeight: 1.25 }],
          heading4stream: ['16px', { lineHeight: 1.25 }],
          label14stream: ['14px', { lineHeight: 1.43 }],
          label18stream: ['18px', { lineHeight: 1.56 }],
          // common
          body: ['14px', { lineHeight: 1.214 }],
          "body-sm": ['12px', { lineHeight: 1.25 }],
          "body-large": ['24px', { lineHeight: '32px' }],
        },
        dropShadow: {
          xl: ['0px 3.2px 16px rgba(153, 179, 249, 0.1)'],
        },
        // 属性值非响应式，无需修改
        boxShadow: {
          sm: '0px 2.4px 4.8px -0.8px rgba(0, 0, 0, 0.2), 0px 1.6px 8px rgba(0, 0, 0, 0.2)',
          lg: '0px 4.8px 9.6px -0.8px rgba(0, 0, 0, 0.2), 0px 3.2px 16px rgba(0, 0, 0, 0.2)',
          lower: '0px 1.2px 2.4px -0.8px rgba(0, 0, 0, 0.1), 0px 0.8px 4px rgba(0, 0, 0, 0.07)',
          high: '0px 9.6px 19.2px -0.8px rgba(0, 0, 0, 0.1), 0px 6.4px 32px rgba(0, 0, 0, 0.07)',
          card: '0px 20px 64px -0.8px rgba(0, 0, 0, 0.06)',
          hide: '0px 0px 0px 0px rgba(0, 0, 0, 0)',
        },
      },
    },
    plugins: [],
  };
  
  module.exports = {
    tailwindConfig
  }