diff --git a/changes/issue-11932-improve-abm-400-error b/changes/issue-11932-improve-abm-400-error
new file mode 100644
index 0000000000..3d6fc2a0cb
--- /dev/null
+++ b/changes/issue-11932-improve-abm-400-error
@@ -0,0 +1 @@
+- add improved ABM 400 error message to the UI
diff --git a/frontend/components/DataError/DataError.tsx b/frontend/components/DataError/DataError.tsx
index 66bcb2a63f..8bea008893 100644
--- a/frontend/components/DataError/DataError.tsx
+++ b/frontend/components/DataError/DataError.tsx
@@ -7,7 +7,7 @@ import Icon from "components/Icon";
 const baseClass = "data-error";
 
 interface IDataErrorProps {
-  children?: JSX.Element | string;
+  children?: React.ReactNode;
   card?: boolean;
   className?: string;
 }
diff --git a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/AppleBusinessManagerSection.tsx b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/AppleBusinessManagerSection.tsx
index 9a8bef65d5..27803db824 100644
--- a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/AppleBusinessManagerSection.tsx
+++ b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/AppleBusinessManagerSection.tsx
@@ -103,6 +103,27 @@ const AppleBusinessManagerSection = () => {
   };
 
   const renderAppleBMInfo = () => {
+    // we want to give a more useful error message for 400s.
+    if (errorMdmAppleBm && errorMdmAppleBm.status === 400) {
+      return (
+        <DataError>
+          <span className={`${baseClass}__400-error-info`}>
+            The Apple Business Manager certificate or server token is invalid.
+            Restart Fleet with a valid certificate and token.
+          </span>
+          <span className={`${baseClass}__400-error-info`}>
+            See our{" "}
+            <CustomLink
+              url="https://fleetdm.com/docs/using-fleet/mdm-setup#apple-business-manager-abm"
+              text="ABM documentation"
+              newTab
+            />{" "}
+            for help.
+          </span>
+        </DataError>
+      );
+    }
+
     // The API returns a 404 error if ABM is not configured yet, in that case we
     // want to prompt the user to download the certs and keys to configure the
     // server instead of the default error message.
@@ -113,6 +134,7 @@ const AppleBusinessManagerSection = () => {
       return <DataError />;
     }
 
+    // no error, but no apple bm data yet. TODO: when does this happen?
     if (!mdmAppleBm) {
       return (
         <>
@@ -154,6 +176,7 @@ const AppleBusinessManagerSection = () => {
       );
     }
 
+    // we have the apple bm data and render it
     return (
       <>
         <div className={`${baseClass}__section-description`}>
diff --git a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/_styles.scss b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/_styles.scss
index e1ae6c9b43..c2e98488af 100644
--- a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/_styles.scss
+++ b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/components/AppleBusinessManagerSection/_styles.scss
@@ -39,4 +39,13 @@
       margin: 0;
     }
   }
+
+  &__400-error-info {
+    display: block;
+    color: $core-fleet-black;
+    font-weight: normal;
+    font-size: $x-small;
+    text-align: left;
+    margin-top: 10px;
+  }
 }