bill/frontend/tailwind.config.js

/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        // 温暖现代主义色彩方案
        primary: {
          DEFAULT: '#F97316', // 橙色
          light: '#FB923C',   // 浅橙色
          dark: '#EA580C',    // 深橙色
          50: '#FFF7ED',
          100: '#FFEDD5',
          200: '#FED7AA',
          300: '#FDBA74',
          400: '#FB923C',
          500: '#F97316',
          600: '#EA580C',
          700: '#C2410C',
          800: '#9A3412',
          900: '#7C2D12',
        },
        accent: {
          blue: '#3B82F6',    // 蓝色 - 收入相关
          green: '#22C55E',   // 绿色 - 成功状态
          red: '#EF4444',     // 红色 - 支出相关
        },
        background: '#F5F5F4', // 背景色
        surface: '#FFFFFF',    // 卡片背景
        text: {
          primary: '#333333',   // 主要文本
          secondary: '#666666', // 次要文本
        },
        border: '#E5E5E5',     // 边框色
        
        // 扩展的语义化颜色
        success: '#22C55E',
        warning: '#F59E0B',
        error: '#EF4444',
        info: '#3B82F6',
      },
      fontFamily: {
        sans: ['Inter', 'Poppins', 'system-ui', 'sans-serif'],
      },
      borderRadius: {
        'xl': '16px',
      },
      boxShadow: {
        'neumorphic': '0 2px 8px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.1)',
        'neumorphic-inset': 'inset 0 2px 4px rgba(0,0,0,0.1)',
      },
    },
  },
  plugins: [],
}