index.css 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. @import "tailwindcss";
  2. @theme {
  3. --color-slate-50: #f8fafc;
  4. --color-slate-100: #f1f5f9;
  5. --color-slate-200: #e2e8f0;
  6. --color-slate-300: #cbd5e1;
  7. --color-slate-400: #94a3b8;
  8. --color-slate-500: #64748b;
  9. --color-slate-600: #475569;
  10. --color-slate-700: #334155;
  11. --color-slate-800: #1e293b;
  12. --color-slate-900: #0f172a;
  13. --color-indigo-50: #eef2ff;
  14. --color-indigo-100: #e0e7ff;
  15. --color-indigo-500: #6366f1;
  16. --color-indigo-600: #4f46e5;
  17. --color-indigo-700: #4338ca;
  18. --color-emerald-50: #ecfdf5;
  19. --color-emerald-100: #d1fae5;
  20. --color-emerald-500: #10b981;
  21. --color-emerald-600: #059669;
  22. --color-amber-50: #fffbeb;
  23. --color-amber-100: #fef3c7;
  24. --color-amber-500: #f59e0b;
  25. --color-amber-600: #d97706;
  26. --color-rose-50: #fff1f2;
  27. --color-rose-100: #ffe4e6;
  28. --color-rose-500: #f43f5e;
  29. --color-rose-600: #dc2626;
  30. /* Custom generic variables */
  31. --font-sans: "Inter", "Roboto", "Outfit", system-ui, sans-serif;
  32. }
  33. @layer utilities {
  34. .glass {
  35. @apply bg-white/70 backdrop-blur-md border border-slate-100 shadow-xl;
  36. }
  37. }
  38. html, body {
  39. @apply m-0 p-0 w-full h-full text-slate-600 bg-slate-50;
  40. font-family: var(--font-sans);
  41. }
  42. #root {
  43. @apply w-full h-full flex flex-col;
  44. }