diff --git a/packages/tailwindcss/src/candidate.ts b/packages/tailwindcss/src/candidate.ts
index e1ce018ecab8..e3f6b92f2827 100644
--- a/packages/tailwindcss/src/candidate.ts
+++ b/packages/tailwindcss/src/candidate.ts
@@ -269,6 +269,12 @@ export function parseCandidate(
     base = base.slice(0, -1)
   }
 
+  // Legacy syntax with leading `!`, e.g. `!mx-4`.
+  else if (base[0] === '!') {
+    state.important = true
+    base = base.slice(1)
+  }
+
   // Arbitrary properties
   if (base[0] === '[') {
     let [baseWithoutModifier, modifierSegment = null] = segment(base, '/')
diff --git a/packages/tailwindcss/src/index.test.ts b/packages/tailwindcss/src/index.test.ts
index aaaa6a05835c..7457ac352450 100644
--- a/packages/tailwindcss/src/index.test.ts
+++ b/packages/tailwindcss/src/index.test.ts
@@ -341,6 +341,14 @@ describe('important', () => {
     `)
   })
 
+  it('should generate an important utility with legacy syntax', () => {
+    expect(run(['!underline'])).toMatchInlineSnapshot(`
+      ".\\!underline {
+        text-decoration-line: underline !important;
+      }"
+    `)
+  })
+
   it('should not mark declarations inside of @keyframes as important', () => {
     expect(
       compileCss(