diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 2e17f815..81dc6abd 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -18,19 +18,6 @@ module.exports = {
     sourceType: "module",
   },
   rules: {
-    "no-restricted-imports": [
-      "error",
-      {
-        paths: [
-          {
-            name: "react",
-            importNames: ["useId"],
-            message:
-              "'useId' is only available in React 18. Please use the ponyfill from 'utils/useId' instead.",
-          },
-        ],
-      },
-    ],
     "prettier/prettier": "error",
   },
   plugins: ["prettier", "react", "@typescript-eslint", "matrix-org"],
diff --git a/package.json b/package.json
index 9b385c11..9befc0ea 100644
--- a/package.json
+++ b/package.json
@@ -119,7 +119,7 @@
     "@fontsource/inter": "^5",
     "@types/react": "*",
     "@vector-im/compound-design-tokens": ">=1.6.1 <2.0.0",
-    "react": "^17 || ^18"
+    "react": "^18"
   },
   "peerDependenciesMeta": {
     "@types/react": {
diff --git a/src/components/Form/Controls/Action/Action.tsx b/src/components/Form/Controls/Action/Action.tsx
index 97ba7cbb..2bf551c9 100644
--- a/src/components/Form/Controls/Action/Action.tsx
+++ b/src/components/Form/Controls/Action/Action.tsx
@@ -15,11 +15,10 @@ limitations under the License.
 */
 
 import classnames from "classnames";
-import React, { forwardRef, ComponentRef, ComponentProps } from "react";
+import React, { forwardRef, ComponentRef, ComponentProps, useId } from "react";
 import styles from "./Action.module.css";
 import { TextInput } from "../Text";
 
-import useId from "../../../../utils/useId";
 import { Control } from "@radix-ui/react-form";
 import { Tooltip } from "../../../Tooltip/Tooltip";
 
diff --git a/src/components/Menu/FloatingMenu.tsx b/src/components/Menu/FloatingMenu.tsx
index 7444e47c..56e8cdee 100644
--- a/src/components/Menu/FloatingMenu.tsx
+++ b/src/components/Menu/FloatingMenu.tsx
@@ -15,9 +15,13 @@ limitations under the License.
 */
 
 import classnames from "classnames";
-import React, { ComponentPropsWithoutRef, ReactNode, forwardRef } from "react";
+import React, {
+  ComponentPropsWithoutRef,
+  ReactNode,
+  forwardRef,
+  useId,
+} from "react";
 import styles from "./FloatingMenu.module.css";
-import useId from "../../utils/useId";
 import { Text } from "../Typography/Text";
 
 interface TitleProps {
diff --git a/src/components/Menu/ToggleMenuItem.tsx b/src/components/Menu/ToggleMenuItem.tsx
index 3879846c..a9bbd04c 100644
--- a/src/components/Menu/ToggleMenuItem.tsx
+++ b/src/components/Menu/ToggleMenuItem.tsx
@@ -14,10 +14,9 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React, { ComponentProps, forwardRef, useCallback } from "react";
+import React, { ComponentProps, forwardRef, useCallback, useId } from "react";
 import { MenuItem } from "./MenuItem";
 import { ToggleInput } from "../Form/Controls/Toggle";
-import useId from "../../utils/useId";
 
 type Props = Pick<
   ComponentProps<typeof MenuItem>,
diff --git a/src/components/Progress/Progress.tsx b/src/components/Progress/Progress.tsx
index e2ba8e1e..49f0f808 100644
--- a/src/components/Progress/Progress.tsx
+++ b/src/components/Progress/Progress.tsx
@@ -14,13 +14,12 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React, { forwardRef } from "react";
+import React, { forwardRef, useId } from "react";
 import classNames from "classnames";
 
 import styles from "./Progress.module.css";
 
 import { Root, Indicator } from "@radix-ui/react-progress";
-import useId from "../../utils/useId";
 
 type ProgressProps = {
   /** The size variant of the progress bar */
diff --git a/src/components/Search/Search.tsx b/src/components/Search/Search.tsx
index 30297338..ab7fb7a3 100644
--- a/src/components/Search/Search.tsx
+++ b/src/components/Search/Search.tsx
@@ -15,12 +15,11 @@ limitations under the License.
 */
 
 import classnames from "classnames";
-import React, { ComponentProps, forwardRef } from "react";
+import React, { ComponentProps, forwardRef, useId } from "react";
 import styles from "./Search.module.css";
 import { Field, Label } from "../Form";
 
 import SearchIcon from "@vector-im/compound-design-tokens/assets/web/icons/search";
-import useId from "../../utils/useId";
 
 type SearchProps = {
   /**
diff --git a/src/utils/useId.ts b/src/utils/useId.ts
deleted file mode 100644
index 998ebd4f..00000000
--- a/src/utils/useId.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-/*
-Copyright 2023 New Vector Ltd
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-// eslint-disable-next-line no-restricted-imports
-import * as React from "react";
-
-// This abomination appears to be needed for consumers that rely on Webpack until
-// https://github.com/webpack/webpack/issues/14814 is fixed
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const react18UseId = (React as any)["useId".toString()];
-
-const getUniqueId = (() => {
-  let index = 1;
-  return () => `:r${index++}:`;
-})();
-
-const useIdPonyFill = (): string => {
-  return React.useMemo(getUniqueId, []);
-};
-
-const useId = typeof react18UseId === "function" ? react18UseId : useIdPonyFill;
-
-export default useId;