diff --git a/UNRELEASED.md b/UNRELEASED.md
index 8dae4c28da3..b611852ec6f 100644
--- a/UNRELEASED.md
+++ b/UNRELEASED.md
@@ -18,6 +18,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f
 - Fixed a bug in `Banner` where loading state wasn't getting passed to `primaryAction` ([#4338](https://github.com/Shopify/polaris-react/pull/4338))
 - Fixed `Popover` not correctly positioning itself ([#4357](https://github.com/Shopify/polaris-react/pull/4357))
 - Fixed a bug `TextField` where Safari would render the incorrect text color ([#4344](https://github.com/Shopify/polaris-react/pull/4344))
+- Fixed screen readers reading out the clear button in `TextField` when there is no input ([#4369](https://github.com/Shopify/polaris-react/pull/4369))
 - Fix bug in Safari where `Button` text is gray instead of white after changing state from disabled to enabled ([#4270](https://github.com/Shopify/polaris-react/pull/4270))
 - Bring back borders on the `IndexTable` sticky cells ([#4150](https://github.com/Shopify/polaris-react/pull/4150))
 - Adjust `IndexTable` sticky z-index to avoid collisions with focused `TextField` ([#4150](https://github.com/Shopify/polaris-react/pull/4150))
diff --git a/src/components/TextField/TextField.scss b/src/components/TextField/TextField.scss
index b1058a4b242..da3dc7d1a70 100644
--- a/src/components/TextField/TextField.scss
+++ b/src/components/TextField/TextField.scss
@@ -231,10 +231,6 @@ $stacking-order: (
   &:disabled {
     cursor: default;
   }
-
-  &.ClearButton-hidden {
-    @include visually-hidden;
-  }
 }
 
 .Spinner {
diff --git a/src/components/TextField/TextField.tsx b/src/components/TextField/TextField.tsx
index 45b56584cfd..9f0d610ed49 100644
--- a/src/components/TextField/TextField.tsx
+++ b/src/components/TextField/TextField.tsx
@@ -274,24 +274,22 @@ export function TextField({
   }
 
   const clearButtonVisible = normalizedValue !== '';
-  const clearButtonClassName = classNames(
-    styles.ClearButton,
-    !clearButtonVisible && styles['ClearButton-hidden'],
-  );
 
-  const clearButtonMarkup = clearButton ? (
-    <button
-      type="button"
-      testID="clearButton"
-      className={clearButtonClassName}
-      onClick={handleClearButtonPress}
-      disabled={disabled}
-      tabIndex={clearButtonVisible ? 0 : -1}
-    >
-      <VisuallyHidden>{i18n.translate('Polaris.Common.clear')}</VisuallyHidden>
-      <Icon source={CircleCancelMinor} color="base" />
-    </button>
-  ) : null;
+  const clearButtonMarkup =
+    clearButtonVisible && clearButton ? (
+      <button
+        type="button"
+        testID="clearButton"
+        className={styles.ClearButton}
+        onClick={handleClearButtonPress}
+        disabled={disabled}
+      >
+        <VisuallyHidden>
+          {i18n.translate('Polaris.Common.clear')}
+        </VisuallyHidden>
+        <Icon source={CircleCancelMinor} color="base" />
+      </button>
+    ) : null;
 
   const handleNumberChange = useCallback(
     (steps: number) => {
diff --git a/src/components/TextField/tests/TextField.test.tsx b/src/components/TextField/tests/TextField.test.tsx
index 980c7814f1f..aa383c93e30 100644
--- a/src/components/TextField/tests/TextField.test.tsx
+++ b/src/components/TextField/tests/TextField.test.tsx
@@ -1068,8 +1068,8 @@ describe('<TextField />', () => {
       expect(findByTestID(textField, 'clearButton').exists()).toBeTruthy();
     });
 
-    it('renders a visually hidden clear button in inputs without a value', () => {
-      const textField = mountWithAppProvider(
+    it('does not render a clear button in inputs without a value', () => {
+      const textField = mountWithApp(
         <TextField
           id="MyTextField"
           label="TextField"
@@ -1079,9 +1079,9 @@ describe('<TextField />', () => {
         />,
       );
 
-      const clearButton = findByTestID(textField, 'clearButton');
-      expect(clearButton.hasClass('ClearButton-hidden')).toBeTruthy();
-      expect(clearButton.prop('tabIndex')).toBe(-1);
+      expect(textField).not.toContainReactComponent('button', {
+        testID: 'clearButton',
+      });
     });
 
     it('calls onClearButtonClicked() with an id when the clear button is clicked', () => {