diff --git a/.changeset/slow-queens-unite.md b/.changeset/slow-queens-unite.md
new file mode 100644
index 0000000000..a1b6b60c64
--- /dev/null
+++ b/.changeset/slow-queens-unite.md
@@ -0,0 +1,6 @@
+---
+"@comet/admin-theme": patch
+"@comet/admin": patch
+---
+
+Prevent the clear-button and the select-arrow from overlapping when using `FinalFormSelect` with the `clearable` prop.
diff --git a/packages/admin/admin-stories/src/admin/form/Select.tsx b/packages/admin/admin-stories/src/admin/form/Select.tsx
index 3097c8be89..6902ab437b 100644
--- a/packages/admin/admin-stories/src/admin/form/Select.tsx
+++ b/packages/admin/admin-stories/src/admin/form/Select.tsx
@@ -1,5 +1,6 @@
 import { Field, FinalFormSelect } from "@comet/admin";
-import { Card, CardContent, MenuItem } from "@mui/material";
+import { Account } from "@comet/admin-icons";
+import { Card, CardContent, InputAdornment, MenuItem } from "@mui/material";
 import { storiesOf } from "@storybook/react";
 import * as React from "react";
 import { Form } from "react-final-form";
@@ -60,6 +61,18 @@ function Story() {
                                         )}
                                     </Field>
 
+                                    <Field name="flavorClearable" label="Clearable Flavor" fullWidth>
+                                        {(props) => (
+                                            <FinalFormSelect {...props} fullWidth clearable>
+                                                {options.map((option: Option) => (
+                                                    <MenuItem value={option.value} key={option.value}>
+                                                        {option.label}
+                                                    </MenuItem>
+                                                ))}
+                                            </FinalFormSelect>
+                                        )}
+                                    </Field>
+
                                     <Field name="flavorRequired" label="Required Flavor" fullWidth>
                                         {(props) => (
                                             <FinalFormSelect {...props} fullWidth required>
@@ -84,6 +97,31 @@ function Story() {
                                         )}
                                     </Field>
 
+                                    <Field name="flavorMultipleAdornments" label="Flavor with adornments" fullWidth>
+                                        {(props) => (
+                                            <FinalFormSelect
+                                                {...props}
+                                                fullWidth
+                                                startAdornment={
+                                                    <InputAdornment position="start">
+                                                        <Account />
+                                                    </InputAdornment>
+                                                }
+                                                endAdornment={
+                                                    <InputAdornment position="end" disablePointerEvents sx={{ width: 24 }}>
+                                                        <Account />
+                                                    </InputAdornment>
+                                                }
+                                            >
+                                                {options.map((option: Option) => (
+                                                    <MenuItem value={option.value} key={option.value}>
+                                                        {option.label}
+                                                    </MenuItem>
+                                                ))}
+                                            </FinalFormSelect>
+                                        )}
+                                    </Field>
+
                                     <Field name="multipleFlavours" label="Multiple Flavours" fullWidth>
                                         {(props) => (
                                             <FinalFormSelect {...props} fullWidth multiple>
diff --git a/packages/admin/admin-theme/src/componentsTheme/getCommonSelectTheme.tsx b/packages/admin/admin-theme/src/componentsTheme/getCommonSelectTheme.tsx
index 7f1c637244..18a0652198 100644
--- a/packages/admin/admin-theme/src/componentsTheme/getCommonSelectTheme.tsx
+++ b/packages/admin/admin-theme/src/componentsTheme/getCommonSelectTheme.tsx
@@ -1,5 +1,5 @@
 import { ChevronDown } from "@comet/admin-icons";
-import { Palette } from "@mui/material";
+import { inputAdornmentClasses, inputBaseClasses, Palette } from "@mui/material";
 
 export const commonSelectDefaultProps = {
     IconComponent: ChevronDown,
@@ -12,6 +12,17 @@ export const commonSelectStyleOverrides = {
     "&:focus": {
         backgroundColor: "transparent",
     },
+
+    [`&.${inputBaseClasses.inputAdornedEnd}`]: {
+        paddingRight: 42,
+    },
+
+    [`& ~ .${inputAdornmentClasses.positionEnd}`]: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        right: 26,
+    },
 };
 
 export const getCommonIconStyleOverrides = (palette: Palette) => ({
diff --git a/packages/admin/admin/src/form/FinalFormSelect.tsx b/packages/admin/admin/src/form/FinalFormSelect.tsx
index 93083dc529..c2297d4fc2 100644
--- a/packages/admin/admin/src/form/FinalFormSelect.tsx
+++ b/packages/admin/admin/src/form/FinalFormSelect.tsx
@@ -35,10 +35,7 @@ export const FinalFormSelect = <T,>({
     ...rest
 }: FinalFormSelectProps<T> & Partial<AsyncOptionsProps<T>> & Omit<SelectProps, "input">) => {
     const selectEndAdornment = clearable ? (
-        <>
-            <ClearInputAdornment position="end" hasClearableContent={Boolean(value)} onClick={() => onChange(undefined)} />
-            {endAdornment}
-        </>
+        <ClearInputAdornment position="end" hasClearableContent={Boolean(value)} onClick={() => onChange(undefined)} />
     ) : (
         endAdornment
     );