Fumi/tailwind.config.js at main · FrozenProductions/Fumi · 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
/** @type {import('tailwindcss').Config} */
export default {
    content: ["./src/**/*.{html,js,ts,jsx,tsx}"],
    theme: {
        extend: {
            colors: {
                fumi: {
                    50: "rgb(var(--color-fumi-50) / <alpha-value>)",
                    100: "rgb(var(--color-fumi-100) / <alpha-value>)",
                    200: "rgb(var(--color-fumi-200) / <alpha-value>)",
                    300: "rgb(var(--color-fumi-300) / <alpha-value>)",
                    400: "rgb(var(--color-fumi-400) / <alpha-value>)",
                    500: "rgb(var(--color-fumi-500) / <alpha-value>)",
                    600: "rgb(var(--color-fumi-600) / <alpha-value>)",
                    700: "rgb(var(--color-fumi-700) / <alpha-value>)",
                    800: "rgb(var(--color-fumi-800) / <alpha-value>)",
                    900: "rgb(var(--color-fumi-900) / <alpha-value>)",
                },
            },
            keyframes: {
                "fade-in": {
                    "0%": { opacity: "0", transform: "scale(0.98)" },
                    "100%": { opacity: "1", transform: "scale(1)" },
                },
                "slide-in": {
                    "0%": { opacity: "0", transform: "translateX(-4px)" },
                    "100%": { opacity: "1", transform: "translateX(0)" },
                },
                "slide-in-from-right": {
                    "0%": { opacity: "0", transform: "translateX(100%)" },
                    "100%": { opacity: "1", transform: "translateX(0)" },
                },
                "slide-out-to-right": {
                    "0%": { opacity: "1", transform: "translateX(0)" },
                    "100%": { opacity: "0", transform: "translateX(100%)" },
                },
            },
            animation: {
                "fade-in":
                    "fade-in 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) forwards",
                "slide-in":
                    "slide-in 0.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards",
                "slide-in-from-right":
                    "slide-in-from-right 0.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards",
                "slide-out-to-right":
                    "slide-out-to-right 0.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards",
            },
        },
    },
    plugins: [require("tailwindcss-motion")],
};