Newer
Older
Claude_Test / tailwind.config.ts
import type { Config } from 'tailwindcss'

const config: Config = {
  content: [
    './pages/**/*.{js,ts,jsx,tsx,mdx}',
    './components/**/*.{js,ts,jsx,tsx,mdx}',
    './app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      colors: {
        primary: {
          DEFAULT: '#0088ff',
          dark: '#0066cc',
          light: '#00aaff',
        },
        secondary: {
          DEFAULT: '#00ddff',
          dark: '#00aacc',
        },
        accent: {
          purple: '#6600ff',
        },
        background: {
          primary: '#050510',
        },
      },
      fontFamily: {
        sans: ['var(--font-inter)', 'system-ui', 'sans-serif'],
        heading: ['var(--font-space-grotesk)', 'system-ui', 'sans-serif'],
        mono: ['var(--font-jetbrains-mono)', 'monospace'],
      },
    },
  },
  plugins: [
    function ({ addUtilities }) {
      addUtilities({
        '.glow-blue': {
          boxShadow: `
            0 0 5px rgba(0, 136, 255, 0.5),
            0 0 10px rgba(0, 136, 255, 0.3),
            0 0 15px rgba(0, 136, 255, 0.2)
          `,
        },
        '.glow-cyan': {
          boxShadow: `
            0 0 5px rgba(0, 221, 255, 0.5),
            0 0 10px rgba(0, 221, 255, 0.3)
          `,
        },
        '.text-glow-blue': {
          textShadow: `
            0 0 5px rgba(0, 136, 255, 0.7),
            0 0 10px rgba(0, 136, 255, 0.5)
          `,
        },
        '.animate-pulse-glow': {
          animation: 'pulse-glow 2s ease-in-out infinite',
        },
        '.bg-card': {
          backgroundColor: 'rgba(0, 40, 80, 0.3)',
        },
      })
    },
  ],
  darkMode: 'class',
}

export default config