diff --git a/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx b/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
index 80126fdc8b4..55a09d3fed5 100644
--- a/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
+++ b/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
@@ -12,6 +12,7 @@ import {
     TextInput,
     TopToolbar,
     SearchInput,
+    FilterButtonProps,
 } from 'react-admin';
 import fakerestDataProvider from 'ra-data-fakerest';
 import {
@@ -162,6 +163,7 @@ const data = {
 const ListToolbar = (props: {
     postFilters: React.ReactElement[];
     args: { disableSaveQuery?: boolean };
+    buttonProps?: FilterButtonProps;
 }) => {
     return (
         <TopToolbar>
@@ -170,6 +172,7 @@ const ListToolbar = (props: {
                 <FilterButton
                     filters={props.postFilters}
                     disableSaveQuery={props.args.disableSaveQuery}
+                    {...props.buttonProps}
                 />
                 <CreateButton />
             </div>
@@ -179,17 +182,24 @@ const ListToolbar = (props: {
 const PostList = (props: {
     postFilters: React.ReactElement[];
     args: { disableSaveQuery?: boolean };
-}) => (
-    <ListBase>
-        <ListToolbar postFilters={props.postFilters} args={props.args} />
-        <Datagrid>
-            <TextField source="id" />
-            <TextField source="title" />
-            <TextField source="body" />
-        </Datagrid>
-        <Pagination />
-    </ListBase>
-);
+    buttonProps?: FilterButtonProps;
+}) => {
+    return (
+        <ListBase>
+            <ListToolbar
+                postFilters={props.postFilters}
+                args={props.args}
+                buttonProps={props.buttonProps}
+            />
+            <Datagrid>
+                <TextField source="id" />
+                <TextField source="title" />
+                <TextField source="body" />
+            </Datagrid>
+            <Pagination />
+        </ListBase>
+    );
+};
 
 export const Basic = (args: { disableSaveQuery?: boolean }) => {
     const postFilters: React.ReactElement[] = [
@@ -372,3 +382,65 @@ export const WithAutoCompleteArrayInput = (args: {
         </MemoryRouter>
     );
 };
+
+export const Variant = () => {
+    const postFilters: React.ReactElement[] = [
+        <TextInput
+            label="Title"
+            source="title"
+            defaultValue="Accusantium qui nihil voluptatum quia voluptas maxime ab similique"
+        />,
+    ];
+    return (
+        <MemoryRouter>
+            <Admin
+                dataProvider={fakerestDataProvider(data)}
+                store={memoryStore()}
+            >
+                <Resource
+                    name="posts"
+                    list={
+                        <PostList
+                            postFilters={postFilters}
+                            args={{}}
+                            buttonProps={{
+                                variant: 'outlined',
+                            }}
+                        />
+                    }
+                />
+            </Admin>
+        </MemoryRouter>
+    );
+};
+
+export const Size = () => {
+    const postFilters: React.ReactElement[] = [
+        <TextInput
+            label="Title"
+            source="title"
+            defaultValue="Accusantium qui nihil voluptatum quia voluptas maxime ab similique"
+        />,
+    ];
+    return (
+        <MemoryRouter>
+            <Admin
+                dataProvider={fakerestDataProvider(data)}
+                store={memoryStore()}
+            >
+                <Resource
+                    name="posts"
+                    list={
+                        <PostList
+                            postFilters={postFilters}
+                            args={{}}
+                            buttonProps={{
+                                size: 'large',
+                            }}
+                        />
+                    }
+                />
+            </Admin>
+        </MemoryRouter>
+    );
+};
diff --git a/packages/ra-ui-materialui/src/list/filter/FilterButton.tsx b/packages/ra-ui-materialui/src/list/filter/FilterButton.tsx
index 8bc828ede50..a1e3ac38aea 100644
--- a/packages/ra-ui-materialui/src/list/filter/FilterButton.tsx
+++ b/packages/ra-ui-materialui/src/list/filter/FilterButton.tsx
@@ -8,7 +8,12 @@ import {
     useContext,
 } from 'react';
 import PropTypes from 'prop-types';
-import { Menu, MenuItem, styled } from '@mui/material';
+import {
+    Menu,
+    MenuItem,
+    styled,
+    ButtonProps as MuiButtonProps,
+} from '@mui/material';
 import ContentFilter from '@mui/icons-material/FilterList';
 import lodashGet from 'lodash/get';
 import isEqual from 'lodash/isEqual';
@@ -28,6 +33,8 @@ export const FilterButton = (props: FilterButtonProps): JSX.Element => {
         filters: filtersProp,
         className,
         disableSaveQuery,
+        size,
+        variant,
         ...rest
     } = props;
     const filters = useContext(FilterContext) || filtersProp;
@@ -141,6 +148,8 @@ export const FilterButton = (props: FilterButtonProps): JSX.Element => {
                 label="ra.action.add_filter"
                 aria-haspopup="true"
                 onClick={handleClickButton}
+                variant={variant}
+                size={size}
             >
                 <ContentFilter />
             </Button>
@@ -256,7 +265,9 @@ FilterButton.propTypes = {
     className: PropTypes.string,
 };
 
-export interface FilterButtonProps extends HtmlHTMLAttributes<HTMLDivElement> {
+export interface FilterButtonProps
+    extends HtmlHTMLAttributes<HTMLDivElement>,
+        Pick<MuiButtonProps, 'variant' | 'size'> {
     className?: string;
     resource?: string;
     filterValues?: any;