tailwind.config.ts 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. export default {
  2. content: ['./src/**/*.{html,js,svelte,ts}'],
  3. theme: {
  4. colors: {
  5. // 主题色
  6. // Theme Color
  7. primary: {
  8. 50: 'rgba(var(--theme-color-primary-50), <alpha-value>)',
  9. 100: 'rgba(var(--theme-color-primary-100), <alpha-value>)',
  10. 200: 'rgba(var(--theme-color-primary-200), <alpha-value>)',
  11. 300: 'rgba(var(--theme-color-primary-300), <alpha-value>)',
  12. 400: 'rgba(var(--theme-color-primary-400), <alpha-value>)',
  13. 500: 'rgba(var(--theme-color-primary-500), <alpha-value>)',
  14. DEFAULT: 'rgba(var(--theme-color-primary), <alpha-value>)',
  15. 700: 'rgba(var(--theme-color-primary-700), <alpha-value>)',
  16. 800: 'rgba(var(--theme-color-primary-800), <alpha-value>)',
  17. 900: 'rgba(var(--theme-color-primary-900), <alpha-value>)',
  18. 950: 'rgba(var(--theme-color-primary-950), <alpha-value>)'
  19. },
  20. dark: {
  21. 50: 'rgba(var(--theme-color-dark-50), <alpha-value>)',
  22. 100: 'rgba(var(--theme-color-dark-100), <alpha-value>)',
  23. 200: 'rgba(var(--theme-color-dark-200), <alpha-value>)',
  24. 300: 'rgba(var(--theme-color-dark-300), <alpha-value>)',
  25. 400: 'rgba(var(--theme-color-dark-400), <alpha-value>)',
  26. 500: 'rgba(var(--theme-color-dark-500), <alpha-value>)',
  27. DEFAULT: 'rgba(var(--theme-color-dark), <alpha-value>)',
  28. 700: 'rgba(var(--theme-color-dark-700), <alpha-value>)',
  29. 800: 'rgba(var(--theme-color-dark-800), <alpha-value>)',
  30. 900: 'rgba(var(--theme-color-dark-900), <alpha-value>)',
  31. 950: 'rgba(var(--theme-color-dark-950), <alpha-value>)'
  32. },
  33. primaryBlack: 'rgba(var(--theme-color-primaryBlack), <alpha-value>)',
  34. primaryWhite: 'rgba(var(--theme-color-primaryWhite), <alpha-value>)',
  35. darkBlack: 'rgba(var(--theme-color-darkBlack), <alpha-value>)',
  36. darkWhite: 'rgba(var(--theme-color-darkWhite), <alpha-value>)',
  37. // 功能色
  38. // Functional Color
  39. success: 'rgba(var(--theme-color-functional-success), <alpha-value>)',
  40. warning: 'rgba(var(--theme-color-functional-warning), <alpha-value>)',
  41. error: 'rgba(var(--theme-color-functional-error), <alpha-value>)',
  42. info: 'rgba(var(--theme-color-functional-info), <alpha-value>)',
  43. // 扩展色
  44. // Extended Color
  45. extend0: 'rgba(var(--theme-color-extend0), <alpha-value>)',
  46. extend1: 'rgba(var(--theme-color-extend1), <alpha-value>)',
  47. extend2: 'rgba(var(--theme-color-extend2), <alpha-value>)',
  48. // 中性色
  49. // Neutral Color
  50. black: '#000000',
  51. white: '#ffffff',
  52. gray: {
  53. 50: '#f2f2f2',
  54. 100: '#e6e6e6',
  55. 200: '#cccccc',
  56. 300: '#b3b3b3',
  57. 400: '#999999',
  58. 500: '#808080',
  59. 600: '#666666',
  60. 700: '#4D4D4D',
  61. 800: '#333333',
  62. 900: '#1A1A1A',
  63. 950: '#0D0D0D'
  64. },
  65. transparent: 'transparent'
  66. },
  67. extend: {
  68. fontFamily: { Trueno: 'Trueno' }
  69. }
  70. },
  71. darkMode: 'class',
  72. plugins: []
  73. };