tailwind.config.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. module.exports = {
  2. important: true,
  3. theme: {
  4. fontFamily: {
  5. sans: [
  6. '-apple-system',
  7. 'BlinkMacSystemFont',
  8. '"Segoe UI"',
  9. 'Roboto',
  10. '"Helvetica Neue"',
  11. 'Arial',
  12. '"Noto Sans"',
  13. 'sans-serif',
  14. '"Apple Color Emoji"',
  15. '"Segoe UI Emoji"',
  16. '"Segoe UI Symbol"',
  17. '"Noto Color Emoji"',
  18. ],
  19. mono: [
  20. 'SFMono-Regular',
  21. 'Menlo',
  22. 'Monaco',
  23. 'Consolas',
  24. '"Liberation Mono"',
  25. '"Courier New"',
  26. 'monospace',
  27. ],
  28. },
  29. colors: {
  30. white: 'var(--white)',
  31. blue: {
  32. 400: 'var(--blue-400)',
  33. },
  34. green: {
  35. 100: 'var(--green-100)',
  36. 300: 'var(--green-300)',
  37. 500: 'var(--green-500)',
  38. },
  39. purple: {
  40. 100: 'var(--purple-100)',
  41. 200: 'var(--purple-200)',
  42. 300: 'var(--purple-300)',
  43. 400: 'var(--purple-400)',
  44. 500: 'var(--purple-500)',
  45. 600: 'var(--purple-600)',
  46. 800: 'var(--purple-800)',
  47. },
  48. red: {
  49. 100: 'var(--red-100)',
  50. 300: 'var(--red-300)',
  51. 400: 'var(--red-400)',
  52. },
  53. yellow: {
  54. 100: 'var(--yellow-100)',
  55. 200: 'var(--yellow-200)',
  56. 300: 'var(--yellow-300)',
  57. 400: 'var(--yellow-400)',
  58. },
  59. gray: {
  60. 50: 'var(--gray-50)',
  61. 100: 'var(--gray-100)',
  62. 200: 'var(--gray-200)',
  63. 300: 'var(--gray-300)',
  64. 400: 'var(--gray-400)',
  65. 500: 'var(--gray-500)',
  66. 600: 'var(--gray-600)',
  67. 700: 'var(--gray-700)',
  68. 800: 'var(--gray-800)',
  69. },
  70. tint: {
  71. 50: 'var(--tint-50)',
  72. 100: 'var(--tint-100)',
  73. 200: 'var(--tint-200)',
  74. 300: 'var(--tint-300)',
  75. 400: 'var(--tint-400)',
  76. 500: 'var(--tint-500)',
  77. 600: 'var(--tint-600)',
  78. 700: 'var(--tint-700)',
  79. },
  80. },
  81. extend: {
  82. borderWidth: {
  83. 3: '3px',
  84. },
  85. boxShadow: {
  86. sm: 'var(--shadow-sm)',
  87. default: 'var(--shadow-default)',
  88. lg: 'var(--shadow-default)',
  89. input: 'var(--shadow-default)',
  90. },
  91. inset: {
  92. full: '100%',
  93. },
  94. maxWidth: {
  95. '7xl': '80rem',
  96. },
  97. minHeight: {
  98. 6: '1.5rem',
  99. 10: '2.5rem',
  100. 12: '3rem',
  101. full: '100%',
  102. },
  103. minWidth: {
  104. 8: '2rem',
  105. },
  106. zIndex: {
  107. 1: '1',
  108. },
  109. leading: {
  110. tight: '1.1',
  111. },
  112. },
  113. },
  114. };