diff --git a/CHANGELOG.md b/CHANGELOG.md
index 36964cae541..ef3aa15c358 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
 - Adjusted the shadow in `EuiComment` ([#4321](https://github.com/elastic/eui/pull/4321))
+- Added `success` and `warning` colors to `EuiButtonEmpty` ([#4325](https://github.com/elastic/eui/pull/4325))
 
 **Bug fixes**
 
@@ -10,6 +11,7 @@
 **Theme: Amsterdam**
 
 - Removed the shadow in `EuiComment` ([#4321](https://github.com/elastic/eui/pull/4321))
+- Reduced font size for `xs` size in `EuiButtonEmpty` ([#4325](https://github.com/elastic/eui/pull/4325))
 
 ## [`30.5.1`](https://github.com/elastic/eui/tree/v30.5.1)
 
diff --git a/src-docs/src/views/button/button_empty.js b/src-docs/src/views/button/button_empty.js
index f340a0c8822..16c1a7eb93b 100644
--- a/src-docs/src/views/button/button_empty.js
+++ b/src-docs/src/views/button/button_empty.js
@@ -6,36 +6,52 @@ import {
   EuiFlexItem,
 } from '../../../../src/components/';
 
+const buttons = ['primary', 'success', 'warning', 'danger', 'text', 'disabled'];
+
 export default () => (
   <div>
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty onClick={() => {}}>Primary</EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty size="s" onClick={() => {}}>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty size="xs" onClick={() => {}}>
-          extra small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
+    {buttons.map((value) => (
+      <>
+        <EuiFlexGroup gutterSize="s" key={value} alignItems="center">
+          <EuiFlexItem grow={false}>
+            <EuiButtonEmpty
+              style={{
+                textTransform: 'capitalize',
+              }}
+              isDisabled={value === 'disabled' ? true : false}
+              color={value !== 'disabled' ? value : 'primary'}
+              onClick={() => {}}>
+              {value}
+            </EuiButtonEmpty>
+          </EuiFlexItem>
+
+          <EuiFlexItem grow={false}>
+            <EuiButtonEmpty
+              isDisabled={value === 'disabled' ? true : false}
+              color={value !== 'disabled' ? value : 'primary'}
+              size="s"
+              onClick={() => {}}>
+              small
+            </EuiButtonEmpty>
+          </EuiFlexItem>
+
+          <EuiFlexItem grow={false}>
+            <EuiButtonEmpty
+              isDisabled={value === 'disabled' ? true : false}
+              color={value !== 'disabled' ? value : 'primary'}
+              size="xs"
+              onClick={() => {}}>
+              extra small
+            </EuiButtonEmpty>
+          </EuiFlexItem>
+        </EuiFlexGroup>
+      </>
+    ))}
 
     <EuiFlexGroup gutterSize="s" alignItems="center">
       <EuiFlexItem grow={false}>
         <EuiButtonEmpty onClick={() => {}} iconType="arrowDown">
-          Primary
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty size="s" onClick={() => {}} iconType="arrowDown">
-          small
+          Icon left
         </EuiButtonEmpty>
       </EuiFlexItem>
 
@@ -44,155 +60,7 @@ export default () => (
           onClick={() => {}}
           iconType="arrowDown"
           iconSide="right">
-          Primary
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right">
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" onClick={() => {}}>
-          Danger
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" size="s" onClick={() => {}}>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" size="xs" onClick={() => {}}>
-          extra small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" onClick={() => {}} iconType="arrowDown">
-          Danger
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown">
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right">
-          Danger
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right">
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="text" onClick={() => {}}>
-          Text
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="text" size="s" onClick={() => {}}>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="text" size="xs" onClick={() => {}}>
-          extra small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="text" onClick={() => {}} iconType="arrowDown">
-          Text
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="text"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown">
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="text"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right">
-          Text
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="text"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right">
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" onClick={() => {}} isDisabled>
-          Disabled
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" size="s" onClick={() => {}} isDisabled>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty color="danger" size="xs" onClick={() => {}} isDisabled>
-          extra small
+          Icon right
         </EuiButtonEmpty>
       </EuiFlexItem>
     </EuiFlexGroup>
@@ -210,51 +78,5 @@ export default () => (
         </EuiButtonEmpty>
       </EuiFlexItem>
     </EuiFlexGroup>
-
-    <EuiFlexGroup gutterSize="s" alignItems="center">
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          onClick={() => {}}
-          iconType="arrowDown"
-          isDisabled>
-          Disabled
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown"
-          isDisabled>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right"
-          isDisabled>
-          Disabled
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-
-      <EuiFlexItem grow={false}>
-        <EuiButtonEmpty
-          color="danger"
-          size="s"
-          onClick={() => {}}
-          iconType="arrowDown"
-          iconSide="right"
-          isDisabled>
-          small
-        </EuiButtonEmpty>
-      </EuiFlexItem>
-    </EuiFlexGroup>
   </div>
 );
diff --git a/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap b/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
index 6331e4f1a20..75b3d5d0257 100644
--- a/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
+++ b/src/components/button/button_empty/__snapshots__/button_empty.test.tsx.snap
@@ -64,6 +64,21 @@ exports[`EuiButtonEmpty props color primary is rendered 1`] = `
 </button>
 `;
 
+exports[`EuiButtonEmpty props color success is rendered 1`] = `
+<button
+  class="euiButtonEmpty euiButtonEmpty--success"
+  type="button"
+>
+  <span
+    class="euiButtonContent euiButtonEmpty__content"
+  >
+    <span
+      class="euiButtonEmpty__text"
+    />
+  </span>
+</button>
+`;
+
 exports[`EuiButtonEmpty props color text is rendered 1`] = `
 <button
   class="euiButtonEmpty euiButtonEmpty--text"
@@ -79,6 +94,21 @@ exports[`EuiButtonEmpty props color text is rendered 1`] = `
 </button>
 `;
 
+exports[`EuiButtonEmpty props color warning is rendered 1`] = `
+<button
+  class="euiButtonEmpty euiButtonEmpty--warning"
+  type="button"
+>
+  <span
+    class="euiButtonContent euiButtonEmpty__content"
+  >
+    <span
+      class="euiButtonEmpty__text"
+    />
+  </span>
+</button>
+`;
+
 exports[`EuiButtonEmpty props contentProps is rendered 1`] = `
 <button
   class="euiButtonEmpty euiButtonEmpty--primary"
diff --git a/src/components/button/button_empty/_button_empty.scss b/src/components/button/button_empty/_button_empty.scss
index 08d14e380a5..462b525aa25 100644
--- a/src/components/button/button_empty/_button_empty.scss
+++ b/src/components/button/button_empty/_button_empty.scss
@@ -69,11 +69,13 @@
 
 // Modifier naming and colors.
 $euiButtonEmptyTypes: (
-  primary: $euiColorPrimary,
-  danger: $euiColorDanger,
+  primary: $euiColorPrimaryText,
+  danger: $euiColorDangerText,
   disabled: $euiButtonColorDisabledText,
   ghost: $euiColorGhost,
   text: $euiTextColor,
+  success: $euiColorSecondaryText,
+  warning: $euiColorWarningText,
 );
 
 // Create button modifiers based upon the map.
diff --git a/src/components/button/button_empty/button_empty.tsx b/src/components/button/button_empty/button_empty.tsx
index 2599fb74acc..e42b92c5d58 100644
--- a/src/components/button/button_empty/button_empty.tsx
+++ b/src/components/button/button_empty/button_empty.tsx
@@ -34,13 +34,21 @@ import {
   EuiButtonContentType,
 } from '../button_content';
 
-export type EuiButtonEmptyColor = 'primary' | 'danger' | 'text' | 'ghost';
+export type EuiButtonEmptyColor =
+  | 'primary'
+  | 'danger'
+  | 'text'
+  | 'ghost'
+  | 'success'
+  | 'warning';
 
 const colorToClassNameMap: { [color in EuiButtonEmptyColor]: string } = {
   primary: 'euiButtonEmpty--primary',
   danger: 'euiButtonEmpty--danger',
   text: 'euiButtonEmpty--text',
   ghost: 'euiButtonEmpty--ghost',
+  success: 'euiButtonEmpty--success',
+  warning: 'euiButtonEmpty--warning',
 };
 
 export const COLORS = keysOf(colorToClassNameMap);
diff --git a/src/themes/eui-amsterdam/overrides/_button_empty.scss b/src/themes/eui-amsterdam/overrides/_button_empty.scss
index 54e7b5b6520..acdec07f7f4 100644
--- a/src/themes/eui-amsterdam/overrides/_button_empty.scss
+++ b/src/themes/eui-amsterdam/overrides/_button_empty.scss
@@ -7,6 +7,10 @@
     // so that they don't appear completely rounded
     border-radius: $euiBorderRadius * .667;
   }
+
+  &.euiButtonEmpty--xSmall {
+    font-size: $euiFontSizeXS;
+  }
 }
 
 @each $name, $color in $euiButtonTypes {