Morak-FE/tailwind.config.js at main · dbstj0403/Morak-FE · 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
72
73
74
75
76
77
78
79
80
export default {
  content: ["./index.html", "./src/**/*.{js,jsx}", "./src/styles/*.css"],
  theme: {
    extend: {
      colors: {
        secondary: "rgba(53, 171, 255, 1)",
        secondary2: "rgba(155, 213, 255, 1)",
        secondary3: "rgba(0, 92, 158, 1)",
        secondaryBackground: "rgba(233, 246, 255, 1)",
        secondaryText: "rgba(0, 92, 158, 1)",
        pre: "rgba(152, 44, 128, 1)",
        error: "rgba(232, 58, 58, 1)",
        errorContainer: "rgba(255, 232, 232, 1)",
        Scrim: "rgba(46, 45, 43, 0.20)",
        supportMessage:
          "linear-gradient(90deg, rgba(255, 111, 49, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), #FFF",

        gray: {
          0: "rgba(255, 255, 255, 1)",
          1: "rgba(253, 253, 253, 1)",
          2: "rgba(250, 250, 249, 1)",
          3: "rgba(245, 244, 244, 1)",
          4: "rgba(235, 234, 233, 1)",
          5: "rgba(214, 213, 210, 1)",
          6: "rgba(194, 191, 188, 1)",
          7: "rgba(173, 170, 165, 1)",
          8: "rgba(153, 149, 143, 1)",
          9: "rgba(130, 127, 122, 1)",
          10: "rgba(107, 104, 100, 1)",
          11: "rgba(77, 75, 72, 1)",
          12: "rgba(46, 45, 43, 1)",
          13: "rgba(15, 15, 14, 1)",
        },
        primary: {
          1: "rgba(255, 252, 251, 1)",
          2: "rgba(255, 248, 245, 1)",
          3: "rgba(255, 241, 234, 1)",
          4: "rgba(255, 226, 214, 1)",
          5: "rgba(255, 197, 173, 1)",
          6: "rgba(255, 169, 131, 1)",
          7: "rgba(255, 140, 90, 1)",
          8: "rgba(255, 111, 49, 1)",
          9: "rgba(217, 94, 42, 1)",
          10: "rgba(179, 78, 34, 1)",
          11: "rgba(128, 56, 25, 1)",
          12: "rgba(77, 33, 15, 1)",
          13: "rgba(26, 11, 5, 1)",
        },
      },
      fontSize: {
        h1: ["1.75rem", { lineHeight: "140%" }],
        h2: ["1.5rem", { lineHeight: "130%" }],
        h3: ["1.25rem", { lineHeight: "130%" }],
        h4: ["1.125rem", { lineHeight: "140%" }],
        b1: ["1rem", { lineHeight: "140%" }],
        b2: ["1rem", { lineHeight: "150%" }],
        b3: ["1rem", { lineHeight: "130%" }],
        b4: ["0.875rem", { lineHeight: "130%" }],
        b5: ["0.875rem", { lineHeight: "130%" }],
        b6: ["0.875rem", { lineHeight: "130%" }],
        caption1: ["0.75rem", { lineHeight: "150%" }],
        caption2: ["0.75rem", { lineHeight: "140%" }],
      },
      fontFamily: {
        pretendard: ["Pretendard", "sans-serif"],
      },
      spacing: {
        21: "84px",
      },
    },
    borderWidth: {
      1.6: "1.6px",
    },
    boxShadow: {
      surface: "0px 2px 12px 0px rgba(46, 45, 43, 0.05)",
      shadow: "0px 2px 12px rgba(255, 111, 49, 0.05)",
    },
  },
  plugins: [],
};