binpin/tailwind.config.js at main · KasinathOfficial/binpin · GitHub

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
export default {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    fontFamily: {
      sans: ['Inter', 'sans-serif'],
    },
    fontSize: {
      xs: ['11px', { lineHeight: '1.5', letterSpacing: '0.08em' }],
      sm: ['13px', { lineHeight: '1.5' }],
      base: ['15px', { lineHeight: '1.5' }],
      lg: ['18px', { lineHeight: '1.5', letterSpacing: '-0.01em', fontWeight: '700' }],
      xl: ['24px', { lineHeight: '1.2', letterSpacing: '-0.02em', fontWeight: '800' }],
      '2xl': ['32px', { lineHeight: '1.1', letterSpacing: '-0.03em', fontWeight: '800' }],
      '3xl': ['48px', { lineHeight: '1', letterSpacing: '-0.03em', fontWeight: '800' }],
    },
    borderRadius: {
      sm: '6px',
      md: '10px',
      lg: '16px',
      xl: '20px',
      full: '999px'
    },
    extend: {
      colors: {
        background: '#FFFFFF',
        surface: {
          DEFAULT: '#F8F9FA',
          raised: '#F1F3F4'
        },
        border: {
          DEFAULT: '#E8EAED',
          strong: '#DADCE0'
        },
        foreground: {
          DEFAULT: '#1A1A2E',
          secondary: '#5F6368',
          muted: '#9AA0A6'
        },
        primary: {
          DEFAULT: '#1E8A4A',
          light: '#E8F5EE',
          glow: '#1E8A4A18'
        },
        orange: {
          DEFAULT: '#F29900',
          light: '#FEF7E0'
        },
        red: {
          DEFAULT: '#D93025',
          light: '#FCE8E6'
        },
        blue: {
          DEFAULT: '#1967D2',
          light: '#E8F0FE'
        }
      },
      boxShadow: {
        soft: '0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.06)',
        medium: '0 4px 16px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.08)',
        strong: '0 8px 32px rgba(0,0,0,0.14), 0 4px 12px rgba(0,0,0,0.10)',
      },
      transitionTimingFunction: {
        'ease-spring': 'cubic-bezier(0.175, 0.885, 0.32, 1.275)',
      },
    },
  },
  plugins: [],
}