File size: 2,513 Bytes
8fb4cca | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 | /** @type {import('tailwindcss').Config} */
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: [],
} |