diff --git a/packages/apollo-wind/src/components/ui/search.test.tsx b/packages/apollo-wind/src/components/ui/search.test.tsx
index 0e08a09eb..c371e21f6 100644
--- a/packages/apollo-wind/src/components/ui/search.test.tsx
+++ b/packages/apollo-wind/src/components/ui/search.test.tsx
@@ -97,6 +97,13 @@ describe('Search', () => {
     expect(input).toHaveClass('custom-search');
   });
 
+  it('suppresses the native search clear button to avoid a duplicate', () => {
+    render(<Search value="test" onChange={vi.fn()} />);
+    const input = screen.getByRole('searchbox');
+    expect(input).toHaveClass('[&::-webkit-search-cancel-button]:appearance-none');
+    expect(input).toHaveClass('[&::-webkit-search-decoration]:appearance-none');
+  });
+
   it('forwards ref correctly', () => {
     const ref = { current: null };
     render(<Search ref={ref} />);
diff --git a/packages/apollo-wind/src/components/ui/search.tsx b/packages/apollo-wind/src/components/ui/search.tsx
index b31408587..06329b4b7 100644
--- a/packages/apollo-wind/src/components/ui/search.tsx
+++ b/packages/apollo-wind/src/components/ui/search.tsx
@@ -45,7 +45,10 @@ const Search = React.forwardRef<HTMLInputElement, SearchProps>(
         <InputGroupInput
           ref={ref}
           type="search"
-          className={className}
+          className={cn(
+            '[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none',
+            className
+          )}
           value={value}
           onChange={(e) => onChange?.(e.target.value)}
           {...props}