hearhere-front/tailwind.config.js at main · aoqlsdl/hearhere-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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/** @type {import('tailwindcss').Config} */
export default {
    content: ["./index.html", "./src/**/*.{js,jsx,ts,tsx}"],
    theme: {
        // theme: {
        screens: {
            1440: "1441px",
        },
        // },
        extend: {
            colors: {
                primary: {
                    PINK: "#E24848",
                    PINK_LIGHT: "#FFE5E5",
                    BLACK100: "#383838",
                    BLACK200: "#464444",
                    BLACK300: "#0B0606",
                    SAND: "#B5A7A4",
                    BEIGE100: "#EEEEEE",
                    BEIGE200: "#CECECE",
                    BEIGE300: "#817674",
                    GRAY100: "#828282",
                    GRAY200: "#CFCFCF",
                    GRAY300: "#47403F",
                    GRAY400: "#ECEBEB",
                    GRAY500: "#F8F7F7",
                    GRAY600: "#E7E7E7",
                    GRAY700: "#464444",
                    GRAY800: "#F4F4F4",
                },
            },
            fontFamily: {
                pre_100: ["Pretendard100"],
                pre_200: ["Pretendard200"],
                pre_300: ["Pretendard300"],
                pre_400: ["Pretendard400"],
                pre_500: ["Pretendard500"],
                pre_700: ["Pretendard700"],
                pre_800: ["Pretendard800"],
                pre_900: ["Pretendard900"],
                Inter: ["Inter", "sans-serif"],
                Luxurious: ["LuxuriousScript"],
            },
            width: {
                "707px": "707px",
                "10px": "10px",
                "20px": "20px",
                "40px": "40px",
                turntable: "25.438rem",
                m_turntable: "11.25rem",
            },
            height: {
                "479px": "479px",
                "437px": "437px",
                "20px": "20px",
                "40px": "40px",
                "89px": "89px",
                turntable: "25.438rem",
                m_turntable: "11.25rem",
            },
            fontSize: {
                title: "7.5rem",
                subtitle: "1.875rem",
                point: "1.88rem",
            },
            spacing: {
                "5.938rem": "5.938rem",
                "2.938rem": "2.938rem",
                "5.313rem": "5.313rem",
            },
            keyframes: {
                slide: {
                    "0%": { transform: "translateX(0)" },
                    "100%": { transform: "translateX(-50%)" },
                },
                fadein: {
                    "0%": { opacity: 0 },
                    "100%": { opacity: 1 },
                },
                fadeout: {
                    "0%": { opacity: 1 },
                    "100%": { opacity: 0 },
                },
            },
            animation: {
                slide: "slide 15s linear infinite",
                fadein: "fadein 0.2s ease-in-out",
                fadeinSlowly: "fadein 0.5s ease-in-out",
                fadeout: "fadeout 0.2s ease-in-out",
            },
            backgroundImage: {
                lps: "url('/assets/img/about_bg.webp')",
                lp: "url('/assets/img/loading_lp.webp')",
                lp_sm: "url('/assets/img/login_lp_sliced.webp')",
                lp_cover: "url('/assets/img/library_cover.webp')",
                tune: "url('/assets/icons/tune.svg')",
                play: "url('/assets/icons/play.svg')",
                pause: "url('/assets/icons/pause.svg')",
                forward: "url('/assets/icons/forward.svg')",
                backward: "url('/assets/icons/backward.svg')",
                save: "url('/assets/icons/save.svg')",
            },
        },
    },
    plugins: [require("tailwind-scrollbar-hide")],
};