tailwind.config.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. /** @type {import('tailwindcss').Config} */
  2. export default {
  3. content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  4. theme: {
  5. extend: {
  6. colors: {
  7. okx: {
  8. black: '#0F0F10',
  9. gray: '#1A1A1B',
  10. border: '#262628',
  11. text: '#EDEDED',
  12. muted: '#9CA3AF',
  13. accent: '#9AED2C',
  14. primary: '#9AED2C'
  15. }
  16. },
  17. fontFamily: {
  18. display: ['Space Grotesk', 'Inter', 'ui-sans-serif', 'system-ui', 'sans-serif'],
  19. sans: ['Inter', 'ui-sans-serif', 'system-ui', 'sans-serif']
  20. },
  21. boxShadow: {
  22. soft: '0 8px 24px rgba(0,0,0,0.25)'
  23. },
  24. backgroundImage: {
  25. 'grid-dark':
  26. 'radial-gradient(circle at 1px 1px, rgba(255,255,255,0.06) 1px, transparent 0)'
  27. },
  28. keyframes: {
  29. marquee: {
  30. '0%': { transform: 'translateX(0)' },
  31. '100%': { transform: 'translateX(-50%)' }
  32. },
  33. float: {
  34. '0%, 100%': { transform: 'translateY(0)' },
  35. '50%': { transform: 'translateY(-6px)' }
  36. }
  37. },
  38. animation: {
  39. marquee: 'marquee 20s linear infinite',
  40. float: 'float 6s ease-in-out infinite'
  41. }
  42. }
  43. },
  44. plugins: []
  45. }