diff --git a/src/docs/pages/AlertsPage.tsx b/src/docs/pages/AlertsPage.tsx
index bb1111d05..5de76b1a5 100644
--- a/src/docs/pages/AlertsPage.tsx
+++ b/src/docs/pages/AlertsPage.tsx
@@ -14,12 +14,12 @@ const AlertsPage: FC = () => {
   const examples: CodeExample[] = [
     {
       title: 'Default alert',
-      code: <Alert color="blue">{alertText}</Alert>,
+      code: <Alert color="info">{alertText}</Alert>,
     },
     {
       title: 'Alerts with icon',
       code: (
-        <Alert color="red" icon={HiInformationCircle}>
+        <Alert color="failure" icon={HiInformationCircle}>
           {alertText}
         </Alert>
       ),
@@ -27,7 +27,7 @@ const AlertsPage: FC = () => {
     {
       title: 'Dismissible alerts',
       code: (
-        <Alert color="green" onDismiss={() => alert('Alert dismissed!')}>
+        <Alert color="success" onDismiss={() => alert('Alert dismissed!')}>
           {alertText}
         </Alert>
       ),
@@ -36,7 +36,7 @@ const AlertsPage: FC = () => {
     {
       title: 'Rounded',
       code: (
-        <Alert color="yellow" rounded={false}>
+        <Alert color="warning" rounded={false}>
           {alertText}
         </Alert>
       ),
@@ -44,7 +44,7 @@ const AlertsPage: FC = () => {
     {
       title: 'Border accent',
       code: (
-        <Alert color="yellow" withBorderAccent>
+        <Alert color="warning" withBorderAccent>
           {alertText}
         </Alert>
       ),
@@ -53,7 +53,7 @@ const AlertsPage: FC = () => {
       title: 'Additional content',
       code: (
         <Alert
-          color="blue"
+          color="info"
           additionalContent={
             <>
               <div className="mt-2 mb-4 text-sm text-blue-700 dark:text-blue-800">
@@ -87,7 +87,7 @@ const AlertsPage: FC = () => {
       title: 'All options',
       code: (
         <Alert
-          color="green"
+          color="success"
           rounded={false}
           withBorderAccent
           onDismiss={() => alert('Alert dismissed!')}
diff --git a/src/lib/components/Alert/Alert.spec.tsx b/src/lib/components/Alert/Alert.spec.tsx
index 977f714d2..a2c8573a3 100644
--- a/src/lib/components/Alert/Alert.spec.tsx
+++ b/src/lib/components/Alert/Alert.spec.tsx
@@ -47,7 +47,7 @@ const TestAlert = (): JSX.Element => {
           </div>
         </>
       }
-      color="blue"
+      color="info"
       icon={HiInformationCircle}
       onDismiss={() => setDismissed(!isDismissed)}
     >
diff --git a/src/lib/components/Alert/Alert.stories.tsx b/src/lib/components/Alert/Alert.stories.tsx
index fd238eb5e..600125332 100644
--- a/src/lib/components/Alert/Alert.stories.tsx
+++ b/src/lib/components/Alert/Alert.stories.tsx
@@ -38,7 +38,7 @@ AlertWithIcons.args = {
 export const AlertDismissible = Template.bind({});
 AlertDismissible.storyName = 'Dismissible';
 AlertDismissible.args = {
-  color: 'green',
+  color: 'success',
   onDismiss: () => alert('Alert dismissed!'),
   children: <>Info alert! Change a few things up and try submitting again.</>,
 };
@@ -46,7 +46,7 @@ AlertDismissible.args = {
 export const AlertRounded = Template.bind({});
 AlertRounded.storyName = 'Not rounded';
 AlertRounded.args = {
-  color: 'yellow',
+  color: 'warning',
   rounded: false,
   onDismiss: false,
   children: <>Info alert! Change a few things up and try submitting again.</>,
@@ -55,7 +55,7 @@ AlertRounded.args = {
 export const AlertWithBorderAccent = Template.bind({});
 AlertWithBorderAccent.storyName = 'Border accent';
 AlertWithBorderAccent.args = {
-  color: 'yellow',
+  color: 'warning',
   onDismiss: false,
   withBorderAccent: true,
   children: <>Info alert! Change a few things up and try submitting again.</>,
@@ -64,7 +64,7 @@ AlertWithBorderAccent.args = {
 export const AlertWithAdditionalContent = Template.bind({});
 AlertWithAdditionalContent.storyName = 'Additional content';
 AlertWithAdditionalContent.args = {
-  color: 'blue',
+  color: 'info',
   icon: HiInformationCircle,
   onDismiss: false,
   withBorderAccent: true,
@@ -101,7 +101,7 @@ AlertWithAdditionalContent.args = {
 export const AlertWithAllOptions = Template.bind({});
 AlertWithAllOptions.storyName = 'All options';
 AlertWithAllOptions.args = {
-  color: 'green',
+  color: 'success',
   rounded: false,
   withBorderAccent: true,
   onDismiss: () => alert('Alert dismissed!'),