diff --git a/src/shared/types/Spacing.ts b/src/shared/types/Spacing.ts
new file mode 100644
index 00000000..ee20deb4
--- /dev/null
+++ b/src/shared/types/Spacing.ts
@@ -0,0 +1,14 @@
+/**
+ * An object representing various spacing values used throughout the application.
+ * Each key corresponds to a specific spacing size based on the 4px grid system.
+ */
+export const spacing = {
+    'spacing-1': '0.125rem',
+    'spacing-2': '0.25rem',
+    'spacing-3': '0.5rem',
+    'spacing-4': '0.75rem',
+    'spacing-5': '1rem',
+    'spacing-6': '1.25rem',
+    'spacing-7': '1.5rem',
+    'spacing-8': '2rem',
+} as const;
diff --git a/unocss.config.ts b/unocss.config.ts
index 6e0375e4..9025e7b6 100644
--- a/unocss.config.ts
+++ b/unocss.config.ts
@@ -4,6 +4,7 @@ import transformerDirectives from '@unocss/transformer-directives';
 import transformerVariantGroup from '@unocss/transformer-variant-group';
 import { defineConfig } from 'unocss';
 
+import { spacing } from './src/shared/types/Spacing';
 import { colors } from './src/shared/types/ThemeColors';
 
 export default defineConfig({
@@ -36,6 +37,7 @@ export default defineConfig({
             'out-expo': 'cubic-bezier(0.19, 1, 0.22, 1)',
         },
         colors,
+        spacing,
     },
     variants: [
         matcher => {