krishnaandhe.github.io/tailwind.config.js at main · krishnaandhe/krishnaandhe.github.io · 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
/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: "class",
  content: [
    "./app/**/*.{js,jsx}",
    "./components/**/*.{js,jsx}",
    "./data/**/*.{js,jsx}",
  ],
  theme: {
    extend: {
      colors: {
        bg: "rgb(var(--bg) / <alpha-value>)",
        surface: "rgb(var(--surface) / <alpha-value>)",
        line: "rgb(var(--line) / <alpha-value>)",
        text: "rgb(var(--text) / <alpha-value>)",
        muted: "rgb(var(--muted) / <alpha-value>)",
        accent: "rgb(var(--accent) / <alpha-value>)",
        accent2: "rgb(var(--accent2) / <alpha-value>)",
      },
      fontFamily: {
        sans: ["Inter", "system-ui", "sans-serif"],
        mono: ["JetBrains Mono", "monospace"],
        hand: ["Caveat", "cursive"],
      },
      container: {
        center: true,
        padding: "1.5rem",
        screens: { "2xl": "1140px" },
      },
      keyframes: {
        wave: {
          "0%,60%,100%": { transform: "rotate(0deg)" },
          "10%,30%": { transform: "rotate(14deg)" },
          "20%": { transform: "rotate(-8deg)" },
          "40%": { transform: "rotate(-4deg)" },
          "50%": { transform: "rotate(10deg)" },
        },
        blob: {
          "0%,100%": { transform: "translate(0,0) scale(1)" },
          "33%": { transform: "translate(30px,-40px) scale(1.1)" },
          "66%": { transform: "translate(-20px,20px) scale(0.95)" },
        },
        spinSlow: {
          "0%": { transform: "rotate(0deg)" },
          "100%": { transform: "rotate(360deg)" },
        },
        bounceTwice: {
          "0%, 100%": { transform: "translateY(0)" },
          "25%, 75%": { transform: "translateY(4px)" },
          "50%": { transform: "translateY(0)" },
        },
      },
      animation: {
        wave: "wave 2.2s ease-in-out infinite",
        blob: "blob 16s ease-in-out infinite",
        spinSlow: "spinSlow 18s linear infinite",
        bounceTwice: "bounceTwice 0.5s ease-in-out",
      },
    },
  },
  plugins: [],
};