frontend-celestia-trace/tailwind.config.js

/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  darkMode: 'class',
  theme: {
    extend: {
      colors: {
        celestia: {
          bg: '#FAFAFC',
          darkBg: '#090A0F',
          card: '#FFFFFF',
          darkCard: '#131620',
          border: 'rgba(0, 0, 0, 0.08)',
          darkBorder: 'rgba(255, 255, 255, 0.10)',
          red: '#E53935',
          gold: '#E6C687',
          subtle: '#8E8E93',
          text: '#1D1D1F',
          darkText: '#F5F5F7',
        },
        spark: {
          dark: '#0B0E14',
          card: '#121824',
          border: 'rgba(255, 255, 255, 0.08)',
          cyan: '#00F2FE',
          blue: '#4FACFE',
          violet: '#7F56D9',
          pink: '#F472B6',
          accent: '#00E5FF'
        }
      },
      fontFamily: {
        sans: ['SF Pro Text', 'SF Pro Display', 'Inter', '-apple-system', 'BlinkMacSystemFont', 'sans-serif'],
        mono: ['SF Mono', 'ui-monospace', 'Menlo', 'Monaco', 'Consolas', 'monospace'],
      },
      boxShadow: {
        'glow-cyan': '0 0 20px rgba(0, 242, 254, 0.25)',
        'glow-red': '0 0 20px rgba(229, 57, 53, 0.3)',
        'glow-gold': '0 0 20px rgba(230, 198, 135, 0.3)',
        'ios-soft': '0 4px 20px -2px rgba(0, 0, 0, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.04)',
        'ios-float': '0 12px 32px -4px rgba(0, 0, 0, 0.12), 0 4px 12px -2px rgba(0, 0, 0, 0.08)',
      },
      letterSpacing: {
        'widest-tech': '0.25em',
        'subtle-mono': '0.15em',
      }
    },
  },
  plugins: [],
}