centurio-front/tailwind.config.js at develop · CommunETHas/centurio-front · 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
const formsPlugin = require('@tailwindcss/forms');

module.exports = {
  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
  darkMode: 'media',
  plugins: [formsPlugin],
  theme: {
    colors: {
      base: '#1EAB89',
      primary: '#20252E',
      secondary: '#FFFFFF',
      secondaryShadow: '#cdcdcd',
      ternary: '#BE7E7E',
      ternaryShadow: '#a06b6b',
      shader: '#797979',
    },
    borderColor: {
      primary: '#20252E',
      secondary: '#FFFFFF',
      ternary: '#BE7E7E',
    },
    fontFamily: {
      sans: ['Graphik', 'sans-serif'],
      serif: ['Merriweather', 'serif'],
    },
    textColor: {
      primary: '#20252E',
      secondary: '#FFFFFF',
      ternary: '#BE7E7E',
      comment: '#A5A5A5',
      negative: '#b91c1c',
      black: '#000000',
    },
    extend: {
      fontSize: {
        '5xl': [
          '2.5rem',
          {
            lineHeight: '3.5rem',
          },
        ],
        '4xl': '2.5rem',
      },
      ringOffsetWidth: {
        18: '18px',
      },
      spacing: {
        0.1: '0.05rem',
        62: '17rem',
        65: '25rem',
        100: '26rem',
        110: '30rem',
        150: '40rem',
        200: '70rem',
        210: '100rem',
      },
      rotate: {
        60: '-60deg',
      },
      gap: {
        13: '3.25rem',
      },
    },
  },
};