Remove double translate-z-px values (#16718)

This PR fixes an issue where if you used `translate-z-px` or
`-translate-z-px` that the utility was generated twice:
```css
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
@Property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@Property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@Property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
```

With this PR, it will only generate once:
```css
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
@Property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@Property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@Property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
```

Author: RobinMalfait

CHANGELOG.md

@@ -24,6 +24,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Vite: Ensure utility classes are read without escaping special characters ([#16631](https://github.com/tailwindlabs/tailwindcss/pull/16631))
 - Allow `theme(…)` options when using `@import` ([#16514](https://github.com/tailwindlabs/tailwindcss/pull/16514))
 - Use amount of properties when sorting ([#16715](https://github.com/tailwindlabs/tailwindcss/pull/16715))
+- Remove double generated `translate-z-px` utilities ([#16718](https://github.com/tailwindlabs/tailwindcss/pull/16718))
 
 ## [4.0.7] - 2025-02-18
 

packages/tailwindcss/src/utilities.test.ts

@@ -4213,16 +4213,22 @@ test('translate-y', async () => {
 })
 
 test('translate-z', async () => {
-  expect(await run(['translate-z-px', '-translate-z-[var(--value)]'])).toMatchInlineSnapshot(`
+  expect(
+    await run(['-translate-z-px', 'translate-z-px', '-translate-z-[var(--value)]']),
+  ).toMatchInlineSnapshot(`
     ".-translate-z-\\[var\\(--value\\)\\] {
       --tw-translate-z: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
     }
 
+    .-translate-z-px {
+      --tw-translate-z: -1px;
+      translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
+    }
+
     .translate-z-px {
       --tw-translate-z: 1px;
       translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
-      translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
     }
 
     @property --tw-translate-x {

packages/tailwindcss/src/utilities.ts

@@ -1230,16 +1230,6 @@ export function createUtilities(theme: Theme) {
       supportsNegative: true,
     },
   )
-  staticUtility(`-translate-z-px`, [
-    translateProperties,
-    [`--tw-translate-z`, '-1px'],
-    ['translate', 'var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z)'],
-  ])
-  staticUtility(`translate-z-px`, [
-    translateProperties,
-    [`--tw-translate-z`, '1px'],
-    ['translate', 'var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z)'],
-  ])
 
   staticUtility('translate-3d', [
     translateProperties,