| |
| export default { |
| content: [ |
| "./index.html", |
| "./**/*.{js,ts,jsx,tsx}", |
| ], |
| theme: { |
| extend: { |
| fontFamily: { |
| serif: ['serif'], |
| sans: ['system-ui', 'sans-serif'], |
| }, |
| colors: { |
| rose: { |
| 50: '#fff1f2', |
| 100: '#ffe4e6', |
| 200: '#fecdd3', |
| 300: '#fda4af', |
| 400: '#fb7185', |
| 500: '#f43f5e', |
| 600: '#e11d48', |
| 700: '#be123c', |
| 800: '#9f1239', |
| 900: '#881337', |
| }, |
| gold: { |
| 400: '#fbbf24', |
| 500: '#f59e0b', |
| } |
| }, |
| animation: { |
| 'fade-in': 'fadeIn 0.5s ease-out', |
| 'fade-in-down': 'fadeInDown 0.5s ease-out', |
| 'bounce-slow': 'bounce 3s infinite', |
| 'pulse-fast': 'pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite', |
| 'spin-slow': 'spin 3s linear infinite', |
| 'scan': 'scan 2s linear infinite', |
| 'swing': 'swing 3s ease-in-out infinite', |
| 'breathing': 'breathing 4s ease-in-out infinite', |
| 'glitch-anim': 'glitch 2s infinite', |
| 'float': 'float 6s ease-in-out infinite' |
| }, |
| keyframes: { |
| fadeIn: { |
| '0%': { opacity: '0' }, |
| '100%': { opacity: '1' }, |
| }, |
| fadeInDown: { |
| '0%': { opacity: '0', transform: 'translateY(-10px)' }, |
| '100%': { opacity: '1', transform: 'translateY(0)' }, |
| }, |
| scan: { |
| '0%': { transform: 'translateY(-100%)' }, |
| '100%': { transform: 'translateY(100%)' }, |
| }, |
| swing: { |
| '0%, 100%': { transform: 'rotate(0deg)' }, |
| '20%': { transform: 'rotate(15deg)' }, |
| '40%': { transform: 'rotate(-10deg)' }, |
| '60%': { transform: 'rotate(5deg)' }, |
| '80%': { transform: 'rotate(-5deg)' }, |
| }, |
| breathing: { |
| '0%, 100%': { transform: 'scale(1)' }, |
| '50%': { transform: 'scale(1.03)' }, |
| }, |
| float: { |
| '0%, 100%': { transform: 'translateY(0)' }, |
| '50%': { transform: 'translateY(-10px)' }, |
| }, |
| glitch: { |
| '0%': { transform: 'translate(0)' }, |
| '20%': { transform: 'translate(-2px, 2px)' }, |
| '40%': { transform: 'translate(-2px, -2px)' }, |
| '60%': { transform: 'translate(2px, 2px)' }, |
| '80%': { transform: 'translate(2px, -2px)' }, |
| '100%': { transform: 'translate(0)' } |
| } |
| } |
| }, |
| }, |
| plugins: [], |
| } |