diff --git a/src/corePlugins.js b/src/corePlugins.js
index b06dbeee6fa7..3cb91990f53b 100644
--- a/src/corePlugins.js
+++ b/src/corePlugins.js
@@ -1801,6 +1801,17 @@ export let corePlugins = {
     })
   },
 
+  textDecorationColor: ({ matchUtilities, theme }) => {
+    matchUtilities(
+      {
+        decoration: (value) => {
+          return { 'text-decoration-color': toColorValue(value) }
+        },
+      },
+      { values: flattenColorPalette(theme('textDecorationColor')), type: ['color', 'any'] }
+    )
+  },
+
   fontSmoothing: ({ addUtilities }) => {
     addUtilities({
       '.antialiased': {
diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
index 2440623ed170..00257df22ff3 100644
--- a/stubs/defaultConfig.stub.js
+++ b/stubs/defaultConfig.stub.js
@@ -787,6 +787,7 @@ module.exports = {
       2: '2',
     },
     textColor: ({ theme }) => theme('colors'),
+    textDecorationColor: ({ theme }) => theme('colors'),
     textIndent: ({ theme }) => ({
       ...theme('spacing'),
     }),
diff --git a/tests/arbitrary-values.test.css b/tests/arbitrary-values.test.css
index edee01b8961d..ada975c32d1c 100644
--- a/tests/arbitrary-values.test.css
+++ b/tests/arbitrary-values.test.css
@@ -807,6 +807,24 @@
 .text-opacity-\[var\(--value\)\] {
   --tw-text-opacity: var(--value);
 }
+.decoration-\[black\] {
+  text-decoration-color: black;
+}
+.decoration-\[rgb\(123\2c 123\2c 123\)\] {
+  text-decoration-color: rgb(123, 123, 123);
+}
+.decoration-\[rgb\(123\2c _123\2c _123\)\] {
+  text-decoration-color: rgb(123, 123, 123);
+}
+.decoration-\[rgb\(123_123_123\)\] {
+  text-decoration-color: rgb(123 123 123);
+}
+.decoration-\[color\:var\(--color\)\] {
+  text-decoration-color: var(--color);
+}
+.decoration-\[var\(--color\)\] {
+  text-decoration-color: var(--color);
+}
 .placeholder-\[var\(--placeholder\)\]::placeholder {
   color: var(--placeholder);
 }
diff --git a/tests/arbitrary-values.test.html b/tests/arbitrary-values.test.html
index 461919d8f53f..d27f2c70d273 100644
--- a/tests/arbitrary-values.test.html
+++ b/tests/arbitrary-values.test.html
@@ -297,6 +297,13 @@
     <div class="text-opacity-[0.8]"></div>
     <div class="text-opacity-[var(--value)]"></div>
 
+    <div class="decoration-[black]"></div>
+    <div class="decoration-[rgb(123,123,123)]"></div>
+    <div class="decoration-[rgb(123,_123,_123)]"></div>
+    <div class="decoration-[rgb(123_123_123)]"></div>
+    <div class="decoration-[color:var(--color)]"></div>
+    <div class="decoration-[var(--color)]"></div>
+
     <div class="placeholder-[var(--placeholder)]"></div>
 
     <div class="placeholder-opacity-[var(--placeholder-opacity)]"></div>
diff --git a/tests/basic-usage.test.css b/tests/basic-usage.test.css
index b14a10774b36..aeff4c30ab7e 100644
--- a/tests/basic-usage.test.css
+++ b/tests/basic-usage.test.css
@@ -773,6 +773,9 @@
 .underline {
   text-decoration: underline;
 }
+.decoration-red-600 {
+  text-decoration-color: #dc2626;
+}
 .antialiased {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
diff --git a/tests/basic-usage.test.html b/tests/basic-usage.test.html
index c40ca8a21353..5d580909cec2 100644
--- a/tests/basic-usage.test.html
+++ b/tests/basic-usage.test.html
@@ -159,8 +159,9 @@
     <div class="text-center"></div>
     <div class="indent-6 -indent-12"></div>
     <div class="text-indigo-500"></div>
-    <div class="underline"></div>
     <div class="text-opacity-10"></div>
+    <div class="underline"></div>
+    <div class="decoration-red-600"></div>
     <div class="overflow-ellipsis truncate"></div>
     <div class="uppercase"></div>
     <div class="transform transform-gpu transform-none"></div>