CSS variables

:root {
  --space-0: 8px; /* 0.5rem */
  --space-1: 12px; /* 0.75rem */
  --space-2: 18px; /* 1.13rem */
  --space-3: 27px; /* 1.69rem */
  --space-4: 40.5px; /* 2.53rem */
  --space-5: 60.75px; /* 3.8rem */
  --space-6: 91.13px; /* 5.7rem */
  --space-7: 136.69px; /* 8.54rem */
  --space-8: 205.03px; /* 12.81rem */
  --space-9: 307.55px; /* 19.22rem */
}

Tailwind theme

// tailwind.config.js
theme: {
  extend: {
    spacing: {
      0: "0.5rem", // 8px
      1: "0.75rem", // 12px
      2: "1.13rem", // 18px
      3: "1.69rem", // 27px
      4: "2.53rem", // 40.5px
      5: "3.8rem", // 60.75px
      6: "5.7rem", // 91.13px
      7: "8.54rem", // 136.69px
      8: "12.81rem", // 205.03px
      9: "19.22rem", // 307.55px
    },
  },
}