this repo has no description
1import colors from 'tailwindcss/colors';
2import { Config } from 'tailwindcss';
3
4export default {
5 content: [
6 './app/**/*.{js,ts,jsx,tsx,mdx}',
7 './components/**/*.{js,ts,jsx,tsx,mdx}',
8 ],
9 future: {
10 hoverOnlyWhenSupported: true,
11 },
12 darkMode: 'class',
13 theme: {
14 extend: {
15 // https://vercel.com/design/color
16 colors: {
17 gray: colors.zinc,
18 'gray-1000': 'rgb(17,17,19)',
19 'gray-1100': 'rgb(10,10,11)',
20 vercel: {
21 pink: '#FF0080',
22 blue: '#0070F3',
23 cyan: '#50E3C2',
24 orange: '#F5A623',
25 violet: '#7928CA',
26 },
27 },
28 backgroundImage: ({ theme }) => ({
29 'vc-border-gradient': `radial-gradient(at left top, ${theme(
30 'colors.gray.500',
31 )}, 50px, ${theme('colors.gray.800')} 50%)`,
32 }),
33 keyframes: ({ theme }) => ({
34 rerender: {
35 '0%': {
36 ['border-color']: theme('colors.vercel.pink'),
37 },
38 '40%': {
39 ['border-color']: theme('colors.vercel.pink'),
40 },
41 },
42 highlight: {
43 '0%': {
44 background: theme('colors.vercel.pink'),
45 color: theme('colors.white'),
46 },
47 '40%': {
48 background: theme('colors.vercel.pink'),
49 color: theme('colors.white'),
50 },
51 },
52 loading: {
53 '0%': {
54 opacity: '.2',
55 },
56 '20%': {
57 opacity: '1',
58 transform: 'translateX(1px)',
59 },
60 to: {
61 opacity: '.2',
62 },
63 },
64 shimmer: {
65 '100%': {
66 transform: 'translateX(100%)',
67 },
68 },
69 translateXReset: {
70 '100%': {
71 transform: 'translateX(0)',
72 },
73 },
74 fadeToTransparent: {
75 '0%': {
76 opacity: '1',
77 },
78 '40%': {
79 opacity: '1',
80 },
81 '100%': {
82 opacity: '0',
83 },
84 },
85 }),
86 },
87 },
88 plugins: [require('@tailwindcss/typography'), require('@tailwindcss/forms')],
89} satisfies Config;