FE/tailwind.config.js at develop · playtab-labs/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
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{js,jsx,ts,tsx}", "./index.js"],
  presets: [require("nativewind/preset")],
  theme: {
    extend: {
      fontSize: {
        // Heading
        h1: ["24px", { lineHeight: "33.6px" }],
        // Title
        t1: ["20px", { lineHeight: "28px" }],
        t2: ["18px", { lineHeight: "25.2px" }],
        t3: ["16px", { lineHeight: "22.4px" }],
        // Body
        b1: ["18px", { lineHeight: "25.2px" }],
        b2: ["16px", { lineHeight: "22.4px" }],
        b3: ["14px", { lineHeight: "19.6px" }],
        b4: ["12px", { lineHeight: "16.8px" }],
        b5: ["10px", { lineHeight: "14px" }],
      },
      fontFamily: {
        "pretendard-rg": ["Pretendard-Regular"],
        "pretendard-sb": ["Pretendard-SemiBold"],
        "pretendard-bd": ["Pretendard-Bold"],
        "pretendard-eb": ["Pretendard-ExtraBold"],
      },
      fontWeight: {
        // Eb = ExtraBold (800), Bd = Bold (700), Sb = SemiBold (600), Rg = Regular (400)
        // 기본 Tailwind에 이미 포함되어 있으나 명시적으로 선언
        eb: "800",
        bd: "700",
        sb: "600",
        rg: "400",
      },
      boxShadow: {
        allos: "0 0 4px 0 rgba(0, 0, 0, 0.25)",
      },
      colors: {
        // ── Grayscale ────────────────────────────
        "extra-white": "#FFFFFF",
        "soft-gray-white": "##F5F5F5",
        "soft-gray": "##E4E4E4",
        gray: "##BFBFBF",
        "dark-gray": "#555555",
        "gray-black": "#1A1A1A",

        // // ── Sogang ───────────────────────────────
        // sogang: {
        //   brown:  "#7B1818",
        //   black:  "#000000",
        //   pink:   "#E5196E",
        //   yellow: "#FFE500",
        //   sky:    "#6CC5C5",
        // },
        primary: {
          "hot-pink": "#FF0F47",
          bk: "#070000",
        },
        secondary: {
          salmon: "#FFAD96",
          "baby-pink": "#F7C1C4",
          "bubblegum-pink": "#F38B98",
        },
        text: {
          salmon: "#FF7654",
        },
      },
    },
  },
  plugins: [],
};