diff --git a/packages/grafana-ui/src/components/Select/SelectMenu.tsx b/packages/grafana-ui/src/components/Select/SelectMenu.tsx
index 8032180e566..8dbe5df52a4 100644
--- a/packages/grafana-ui/src/components/Select/SelectMenu.tsx
+++ b/packages/grafana-ui/src/components/Select/SelectMenu.tsx
@@ -47,7 +47,12 @@ export const SelectMenuOptions = React.forwardRef<HTMLDivElement, React.PropsWit
     return (
       <div
         ref={ref}
-        className={cx(styles.option, isFocused && styles.optionFocused, isSelected && styles.optionSelected)}
+        className={cx(
+          styles.option,
+          isFocused && styles.optionFocused,
+          isSelected && styles.optionSelected,
+          data.isDisabled && styles.optionDisabled
+        )}
         {...innerProps}
         aria-label="Select option"
       >
diff --git a/packages/grafana-ui/src/components/Select/getSelectStyles.ts b/packages/grafana-ui/src/components/Select/getSelectStyles.ts
index 8821b1cc74e..9d025aaad83 100644
--- a/packages/grafana-ui/src/components/Select/getSelectStyles.ts
+++ b/packages/grafana-ui/src/components/Select/getSelectStyles.ts
@@ -57,6 +57,12 @@ export const getSelectStyles = stylesFactory((theme: GrafanaTheme2) => {
     optionSelected: css`
       background: ${theme.colors.action.selected};
     `,
+    optionDisabled: css`
+      label: grafana-select-option-disabled;
+      background-color: ${theme.colors.action.disabledBackground};
+      color: ${theme.colors.action.disabledText};
+      cursor: not-allowed;
+    `,
     singleValue: css`
       label: grafana-select-single-value;
       color: ${theme.components.input.text};