diff --git a/website/src/components/SearchPage/fields/TextField.spec.tsx b/website/src/components/SearchPage/fields/TextField.spec.tsx
index f8de47f0dc..c9a5f26efe 100644
--- a/website/src/components/SearchPage/fields/TextField.spec.tsx
+++ b/website/src/components/SearchPage/fields/TextField.spec.tsx
@@ -31,6 +31,14 @@ describe('TextField', () => {
         expect(handleChange).toHaveBeenCalled();
     });
 
+    it('applies transparent background classes to label in placeholder state', () => {
+        render(<TextField label='Test Field' />);
+
+        const label = screen.getByText('Test Field');
+        expect(label).toHaveClass('peer-placeholder-shown:!bg-transparent');
+        expect(label).toHaveClass('!bg-inherit');
+    });
+
     it('strips newlines on paste in single-line input', () => {
         const handleChange = vi.fn();
         render(<TextField label='Test Field' onChange={handleChange} />);
diff --git a/website/src/components/SearchPage/fields/TextField.tsx b/website/src/components/SearchPage/fields/TextField.tsx
index ba99511c18..f840e0c636 100644
--- a/website/src/components/SearchPage/fields/TextField.tsx
+++ b/website/src/components/SearchPage/fields/TextField.tsx
@@ -27,6 +27,7 @@ interface TextFieldProps {
 
 const helperTextClasses = getTheme().floatingLabel.helperText.default;
 const inputClasses = getTheme().floatingLabel.input.default.outlined.md;
+const labelClasses = getTheme().floatingLabel.label.default.outlined.md;
 
 export const TextField = forwardRef<HTMLInputElement | HTMLTextAreaElement, TextFieldProps>(function (props, ref) {
     const { label, disabled, onChange, autoComplete, fieldValue, className, onFocus, multiline, onBlur } = props;
@@ -138,6 +139,13 @@ export const TextField = forwardRef<HTMLInputElement | HTMLTextAreaElement, Text
                                 },
                             },
                         },
+                        label: {
+                            default: {
+                                outlined: {
+                                    md: `${labelClasses} !bg-inherit peer-placeholder-shown:!bg-transparent peer-focus:!bg-inherit`,
+                                },
+                            },
+                        },
                     }}
                     {...inputProps}
                     variant='outlined'
@@ -173,7 +181,7 @@ export const TextField = forwardRef<HTMLInputElement | HTMLTextAreaElement, Text
                 htmlFor={id}
                 className={`absolute text-sm text-gray-500 dark:text-gray-400 pointer-events-none ${
                     isTransitionEnabled ? 'duration-300' : ''
-                } transform -translate-y-3 scale-75 top-1 z-10 origin-[0] bg-white dark:bg-gray-900 px-2 peer-focus:px-2 peer-focus:text-blue-600 peer-focus:dark:text-blue-500 peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2 peer-focus:top-1 peer-focus:scale-75 peer-focus:-translate-y-3 start-1 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto`}
+                } transform -translate-y-3 scale-75 top-1 z-10 origin-[0] !bg-inherit px-2 peer-focus:px-2 peer-focus:!bg-inherit peer-focus:text-blue-600 peer-focus:dark:text-blue-500 peer-placeholder-shown:!bg-transparent peer-placeholder-shown:scale-100 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:top-1/2 peer-focus:top-1 peer-focus:scale-75 peer-focus:-translate-y-3 start-1 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto`}
             >
                 {label}
             </label>