diff --git a/package.json b/package.json
index 5a7ecd7..fc8acfc 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "core-js": "^2.6.5",
     "tailwindcss-interaction-variants": "^2.0.0-beta.1",
+    "tailwindcss-spaced-items": "^0.1.0",
     "vue": "^2.6.10",
     "vue-router": "^3.0.3"
   },
diff --git a/tailwind.config.js b/tailwind.config.js
index 77b6780..9da5959 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,5 +1,3 @@
-require('tailwindcss-interaction-variants')
-
 const defaultConfig = require('tailwindcss/defaultConfig')
 
 module.exports = {
@@ -17,6 +15,7 @@ module.exports = {
     textDecoration: [...defaultConfig.variants.textDecoration, 'group-hover', 'hocus', 'group-hocus']
   },
   plugins: [
+    require('tailwindcss-spaced-items')({ values: defaultConfig.theme.spacing }),
     require('tailwindcss-interaction-variants')(),
   ]
 }
diff --git a/yarn.lock b/yarn.lock
index 439e948..f58b04f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9018,6 +9018,11 @@ tailwindcss-interaction-variants@^2.0.0-beta.1:
   dependencies:
     lodash "^4.17.11"
 
+tailwindcss-spaced-items@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/tailwindcss-spaced-items/-/tailwindcss-spaced-items-0.1.0.tgz#e7f381e5c780a034bcdbc38a6a2cfb31f828a020"
+  integrity sha512-YiT1h89fp13r6I+EBM8wS1RWfsTwzHSi4BAnHoTXXQK1GQ53DUCPeFNmiksYSdx2aQLMdp/DTPvErqBVfTALiQ==
+
 tailwindcss@^1.0.0-beta.8:
   version "1.0.0-beta.8"
   resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-1.0.0-beta.8.tgz#62c04d4bb342933b45164735b0334119651cd733"