diff --git a/.changeset/sharp-fireants-know.md b/.changeset/sharp-fireants-know.md
new file mode 100644
index 0000000000..068e382791
--- /dev/null
+++ b/.changeset/sharp-fireants-know.md
@@ -0,0 +1,5 @@
+---
+"@frontify/fondue-components": patch
+---
+
+feat: update styles and add migration guide
diff --git a/packages/components/src/components/Select/Combobox.tsx b/packages/components/src/components/Select/Combobox.tsx
index a4f6c5f9c2..bd405e03d7 100644
--- a/packages/components/src/components/Select/Combobox.tsx
+++ b/packages/components/src/components/Select/Combobox.tsx
@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { IconCaretDown } from '@frontify/fondue-icons';
+import { IconCaretDown, IconCheckMark, IconExclamationMarkTriangle } from '@frontify/fondue-icons';
 import * as RadixPopover from '@radix-ui/react-popover';
 import { Slot as RadixSlot } from '@radix-ui/react-slot';
 import { useCombobox } from 'downshift';
@@ -31,6 +31,11 @@ export type ComboboxProps = {
      * The placeholder in the combobox component.
      */
     placeholder?: string;
+    /**
+     * Status of the text input
+     * @default "neutral"
+     */
+    status?: 'neutral' | 'success' | 'error' | 'loading';
     /**
      * Disables the combobox component.
      */
@@ -52,6 +57,7 @@ export const SelectCombobox = (
         value,
         defaultValue,
         placeholder = '',
+        status = 'neutral',
         disabled,
         'aria-label': ariaLabel,
         'data-test-id': dataTestId = 'fondue-select-combobox',
@@ -96,7 +102,7 @@ export const SelectCombobox = (
     return (
         <RadixPopover.Root open={isOpen}>
             <RadixPopover.Anchor asChild>
-                <div ref={forwardedRef} className={styles.root} data-error={valueInvalid}>
+                <div ref={forwardedRef} className={styles.root} data-status={status} data-error={valueInvalid}>
                     <input
                         onMouseDown={(mouseEvent) => {
                             wasClicked.current = true;
@@ -146,6 +152,20 @@ export const SelectCombobox = (
                     >
                         <IconCaretDown size={16} className={styles.caret} />
                     </button>
+                    {status === 'success' ? (
+                        <IconCheckMark
+                            size={16}
+                            className={styles.iconSuccess}
+                            data-test-id={`${dataTestId}-success-icon`}
+                        />
+                    ) : null}
+                    {status === 'error' ? (
+                        <IconExclamationMarkTriangle
+                            size={16}
+                            className={styles.iconError}
+                            data-test-id={`${dataTestId}-error-icon`}
+                        />
+                    ) : null}
                 </div>
             </RadixPopover.Anchor>
 
diff --git a/packages/components/src/components/Select/Select.tsx b/packages/components/src/components/Select/Select.tsx
index 924b064cdb..f366e2a22d 100644
--- a/packages/components/src/components/Select/Select.tsx
+++ b/packages/components/src/components/Select/Select.tsx
@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { IconCaretDown } from '@frontify/fondue-icons';
+import { IconCaretDown, IconCheckMark, IconExclamationMarkTriangle } from '@frontify/fondue-icons';
 import * as RadixPopover from '@radix-ui/react-popover';
 import { Slot as RadixSlot } from '@radix-ui/react-slot';
 import { useSelect } from 'downshift';
@@ -34,6 +34,11 @@ export type SelectComponentProps = {
      * The placeholder in the select component.
      */
     placeholder?: string;
+    /**
+     * Status of the text input
+     * @default "neutral"
+     */
+    status?: 'neutral' | 'success' | 'error' | 'loading';
     /**
      * Disables the select component.
      */
@@ -55,6 +60,7 @@ export const SelectInput = (
         value,
         defaultValue,
         placeholder = '',
+        status = 'neutral',
         disabled,
         'aria-label': ariaLabel,
         'data-test-id': dataTestId = 'fondue-select',
@@ -82,6 +88,7 @@ export const SelectInput = (
             <RadixPopover.Anchor asChild>
                 <div
                     className={styles.root}
+                    data-status={status}
                     data-disabled={disabled}
                     data-empty={!selectedItem}
                     data-test-id={dataTestId}
@@ -107,6 +114,20 @@ export const SelectInput = (
                     )}
                     <div>
                         <IconCaretDown size={16} className={styles.caret} />
+                        {status === 'success' ? (
+                            <IconCheckMark
+                                size={16}
+                                className={styles.iconSuccess}
+                                data-test-id={`${dataTestId}-success-icon`}
+                            />
+                        ) : null}
+                        {status === 'error' ? (
+                            <IconExclamationMarkTriangle
+                                size={16}
+                                className={styles.iconError}
+                                data-test-id={`${dataTestId}-error-icon`}
+                            />
+                        ) : null}
                     </div>
                 </div>
             </RadixPopover.Anchor>
diff --git a/packages/components/src/components/Select/styles/select.module.scss b/packages/components/src/components/Select/styles/select.module.scss
index f3e5be4a5b..35a0b5edd9 100644
--- a/packages/components/src/components/Select/styles/select.module.scss
+++ b/packages/components/src/components/Select/styles/select.module.scss
@@ -44,6 +44,10 @@
         border-color: var(--text-color-negative);
     }
 
+    &[data-status='success'] {
+        border-color: var(--text-color-positive);
+    }
+
     &[data-empty='true'] {
         color: var(--text-color-x-weak);
     }
@@ -177,6 +181,7 @@
     border: var(--line-width) solid var(--line-color-strong);
     width: var(--radix-popover-trigger-width);
     overflow: auto;
+    padding: sizeToken(2) 0;
 
     &:has(li[role='option']) {
         display: block;
@@ -210,3 +215,47 @@
         border-bottom: var(--line-width) solid var(--line-color-strong);
     }
 }
+
+.iconSuccess {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    margin-left: sizeToken(3);
+    color: var(--text-color-positive);
+}
+
+.iconError {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    margin-left: sizeToken(3);
+    color: var(--text-color-negative);
+}
+
+.loadingStatus {
+    display: flex;
+    position: absolute;
+    width: sizeToken(6);
+    height: sizeToken(6);
+    top: sizeToken(-3);
+    right: sizeToken(-3);
+    pointer-events: none;
+    align-items: center;
+    justify-content: center;
+    background-color: var(--base-color);
+    border: var(--line-width) solid var(--line-color-strong);
+    border-radius: 9999px;
+
+    &::before {
+        content: '';
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: sizeToken(4);
+        height: sizeToken(4);
+        border: var(--line-width) solid var(--text-color-interactive);
+        border-top-color: transparent;
+        border-radius: 9999px;
+        animation: spin 1s linear infinite;
+    }
+}