diff --git a/CHANGELOG.md b/CHANGELOG.md
index 82ff37ea613..e720bef827b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,11 @@
 **Bug Fixes**
 
 - Fixed `EuiDataGrid`'s sort popover to behave properly on mobile screens ([#2979](https://github.com/elastic/eui/pull/2979))
+- Fixed `EuiButton` and other textual components' disabled contrast ([#2874](https://github.com/elastic/eui/pull/2874))
+
+**Theme: Amsterdam**
+
+- Buttons have a new visual style ([#2874](https://github.com/elastic/eui/pull/2874))
 
 ## [`20.1.0`](https://github.com/elastic/eui/tree/v20.1.0)
 
diff --git a/src-docs/src/views/button/button_ghost.js b/src-docs/src/views/button/button_ghost.js
index e60e3d94cb8..1eba4b99362 100644
--- a/src-docs/src/views/button/button_ghost.js
+++ b/src-docs/src/views/button/button_ghost.js
@@ -33,7 +33,7 @@ export default class extends Component {
           <EuiButton
             color="ghost"
             onClick={() => window.alert('Button clicked')}>
-            Primary
+            Ghost
           </EuiButton>
         </EuiFlexItem>
 
diff --git a/src/components/badge/_badge.scss b/src/components/badge/_badge.scss
index 1333a8623f7..d998f6060e1 100644
--- a/src/components/badge/_badge.scss
+++ b/src/components/badge/_badge.scss
@@ -23,7 +23,7 @@
     // sass-lint:disable-block no-important
     // Using !important to override inline styles
     background-color: $euiButtonColorDisabled !important;
-    color: $euiColorEmptyShade !important;
+    color: $euiButtonColorDisabledText !important;
   }
 
   &:focus-within {
diff --git a/src/components/button/_button.scss b/src/components/button/_button.scss
index 1d562b8b179..2551d35f3f5 100644
--- a/src/components/button/_button.scss
+++ b/src/components/button/_button.scss
@@ -44,7 +44,7 @@
   }
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     border-color: $euiButtonColorDisabled;
     pointer-events: none;
 
@@ -53,8 +53,13 @@
       cursor: not-allowed;
     }
 
+    .euiButton__spinner {
+      border-color: euiLoadingSpinnerBorderColors(currentColor);
+    }
+
     &.euiButton--fill {
-      color: $euiColorGhost;
+      // Only increase the contrast of background color to text to 2.0 for disabled
+      color: makeHighContrastColor($euiButtonColorDisabled, $euiButtonColorDisabled, 2);
       background-color: $euiButtonColorDisabled;
       border-color: $euiButtonColorDisabled;
 
@@ -85,7 +90,7 @@
       color: $euiTextColor;
     } @else {
       // Other colors need to check their contrast against the page background color.
-      color: makeHighContrastColor($color, $euiColorEmptyShade);
+      color: makeHighContrastColor($color, $euiPageBackgroundColor);
     }
 
     border-color: $color;
@@ -106,10 +111,6 @@
           border-color: darken($color, 5%);
         }
       }
-
-      &:disabled .euiButton__spinner {
-        border-color: euiLoadingSpinnerBorderColors(transparentize($fillTextColor, .3));
-      }
     }
 
     &:enabled {
@@ -133,14 +134,22 @@
         }
       }
     }
+  }
+}
 
-    &:disabled,
-    &:disabled:hover,
-    &:disabled:focus {
-      @if ($name == 'ghost') {
-        @include euiSlightShadow($euiColorInk);
-      }
-    }
+// Fix ghost/disabled look specifically
+.euiButton:disabled.euiButton--ghost {
+  &,
+  &:hover,
+  &:focus {
+    @include euiSlightShadow($euiColorInk);
+    color: $euiButtonColorGhostDisabled;
+    border-color: $euiButtonColorGhostDisabled;
+  }
+
+  &.euiButton--fill {
+    background-color: $euiButtonColorGhostDisabled;
+    color: makeHighContrastColor($euiButtonColorGhostDisabled, $euiButtonColorGhostDisabled, 2);
   }
 }
 
diff --git a/src/components/button/button.tsx b/src/components/button/button.tsx
index e39047933c3..867a8633b1d 100644
--- a/src/components/button/button.tsx
+++ b/src/components/button/button.tsx
@@ -27,6 +27,10 @@ export type ButtonColor =
   | 'warning'
   | 'danger'
   | 'ghost'
+  /**
+   * Set for deprecation 2/26/20
+   * This color button can easily be confused with disabled, it should not be used
+   */
   | 'text';
 
 export type ButtonSize = 's' | 'm';
@@ -60,6 +64,9 @@ export interface EuiButtonProps extends CommonProps {
   iconType?: IconType;
   iconSide?: ButtonIconSide;
   fill?: boolean;
+  /**
+   * `text` color is set for deprecation
+   */
   color?: ButtonColor;
   size?: ButtonSize;
   isLoading?: boolean;
diff --git a/src/components/button/button_empty/_button_empty.scss b/src/components/button/button_empty/_button_empty.scss
index 3fd15cbac1e..70fce6cd5ee 100644
--- a/src/components/button/button_empty/_button_empty.scss
+++ b/src/components/button/button_empty/_button_empty.scss
@@ -41,7 +41,7 @@
   }
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     pointer-events: none;
 
     .euiButtonEmpty__content {
@@ -50,7 +50,7 @@
     }
 
     .euiButtonEmpty__icon {
-      fill: $euiButtonColorDisabled;
+      fill: currentColor;
     }
 
     &:focus {
@@ -68,7 +68,7 @@
 $euiButtonEmptyTypes: (
   primary: $euiColorPrimary,
   danger: $euiColorDanger,
-  disabled: tintOrShade($euiTextColor, 70%, 80%),
+  disabled: $euiButtonColorDisabledText,
   ghost: $euiColorGhost,
   text: $euiTextColor,
 );
diff --git a/src/components/button/button_icon/_button_icon.scss b/src/components/button/button_icon/_button_icon.scss
index cbb7a3b3c4c..7c3195a6313 100644
--- a/src/components/button/button_icon/_button_icon.scss
+++ b/src/components/button/button_icon/_button_icon.scss
@@ -18,7 +18,7 @@
   }
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     pointer-events: none;
 
     .euiButtonIcon__icon {
@@ -34,18 +34,6 @@
   }
 }
 
-// Modifier naming and colors.
-$euiButtonIconTypes: (
-  danger: $euiColorDanger,
-  disabled: $euiButtonColorDisabled,
-  ghost: $euiColorGhost,
-  primary: $euiColorPrimary,
-  subdued: $euiColorDarkShade,
-  success: $euiColorSuccess,
-  text: $euiTextColor,
-  warning: $euiColorWarning,
-);
-
 // Create button modifiders based upon the map.
 @each $name, $color in $euiButtonIconTypes {
   .euiButtonIcon--#{$name} {
diff --git a/src/components/button/button_icon/_index.scss b/src/components/button/button_icon/_index.scss
index d7a1e7f325a..8c43634e903 100644
--- a/src/components/button/button_icon/_index.scss
+++ b/src/components/button/button_icon/_index.scss
@@ -1 +1,2 @@
+@import 'variables';
 @import 'button_icon';
diff --git a/src/components/button/button_icon/_variables.scss b/src/components/button/button_icon/_variables.scss
new file mode 100644
index 00000000000..83461711131
--- /dev/null
+++ b/src/components/button/button_icon/_variables.scss
@@ -0,0 +1,11 @@
+// Modifier naming and colors.
+$euiButtonIconTypes: (
+  danger: $euiColorDanger,
+  disabled: $euiButtonColorDisabledText,
+  ghost: $euiColorGhost,
+  primary: $euiColorPrimary,
+  subdued: $euiColorDarkShade,
+  success: $euiColorSuccess,
+  text: $euiTextColor,
+  warning: $euiColorWarning,
+);
diff --git a/src/components/context_menu/_context_menu_item.scss b/src/components/context_menu/_context_menu_item.scss
index 8675f1429cb..894fe91468c 100644
--- a/src/components/context_menu/_context_menu_item.scss
+++ b/src/components/context_menu/_context_menu_item.scss
@@ -15,7 +15,7 @@
   }
 
   &.euiContextMenuItem-isDisabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     cursor: default;
 
     &:hover,
diff --git a/src/components/facet/_facet_button.scss b/src/components/facet/_facet_button.scss
index 8a2e1de4611..52c5db4bbc6 100644
--- a/src/components/facet/_facet_button.scss
+++ b/src/components/facet/_facet_button.scss
@@ -31,7 +31,7 @@
   }
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     pointer-events: none;
 
     .euiFacetButton__content {
diff --git a/src/components/filter_group/_filter_button.scss b/src/components/filter_group/_filter_button.scss
index 048779df9cf..3c1a6d2bdd8 100644
--- a/src/components/filter_group/_filter_button.scss
+++ b/src/components/filter_group/_filter_button.scss
@@ -7,7 +7,7 @@
   font-size: $euiFontSizeS;
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     pointer-events: none;
 
     .euiFilterButton__notification {
diff --git a/src/components/key_pad_menu/_key_pad_menu.scss b/src/components/key_pad_menu/_key_pad_menu.scss
index 6e4ffd78350..5fd0ebb7f83 100644
--- a/src/components/key_pad_menu/_key_pad_menu.scss
+++ b/src/components/key_pad_menu/_key_pad_menu.scss
@@ -42,14 +42,14 @@
   }
 
   &:disabled {
-    color: $euiButtonColorDisabled;
+    color: $euiButtonColorDisabledText;
     cursor: not-allowed;
 
     .euiKeyPadMenuItem__icon  {
       filter: grayscale(100%);
 
       svg * { // sass-lint:disable-line nesting-depth
-        fill: $euiButtonColorDisabled;
+        fill: $euiButtonColorDisabledText;
       }
     }
 
diff --git a/src/global_styling/functions/_colors.scss b/src/global_styling/functions/_colors.scss
index 887a363be3c..f650f4261af 100644
--- a/src/global_styling/functions/_colors.scss
+++ b/src/global_styling/functions/_colors.scss
@@ -128,4 +128,3 @@
 @function makeGraphicContrastColor($color, $background: $euiPageBackgroundColor) {
   @return makeHighContrastColor($color, $background, 3);
 }
-
diff --git a/src/global_styling/mixins/_button.scss b/src/global_styling/mixins/_button.scss
index 41593f84177..1ed23faebc2 100644
--- a/src/global_styling/mixins/_button.scss
+++ b/src/global_styling/mixins/_button.scss
@@ -1,29 +1,25 @@
-@mixin euiButton {
-  @include euiFont;
-  @include euiFontSize;
-
+// Provides a solid reset and base for handling sizing layout
+// Does not include any visual styles
+@mixin euiButtonBase {
   display: inline-block;
   appearance: none;
   cursor: pointer;
   height: $euiButtonHeight;
   line-height: $euiButtonHeight; // prevents descenders from getting cut off
-  text-decoration: none;
-  border: solid 1px transparent;
   text-align: center;
-  transition: all $euiAnimSpeedNormal $euiAnimSlightBounce;
   white-space: nowrap;
   max-width: 100%;
   vertical-align: middle;
+}
+
+// Adds the focus (and hover) animation for translating up 1px
+@mixin euiButtonFocus {
+  transition: all $euiAnimSpeedNormal ease-in-out;
 
   &:hover:not(:disabled) {
     transform: translateY(-1px);
   }
 
-  &:hover:not(:disabled),
-  &:focus {
-    text-decoration: underline;
-  }
-
   &:focus {
     animation: euiButtonActive $euiAnimSpeedNormal $euiAnimSlightBounce;
   }
@@ -33,9 +29,35 @@
   }
 }
 
+// All of the button base styles including the base, focus, font, and initial styles
+// Does not include individual alterations like color or sizes
+@mixin euiButton {
+  @include euiButtonBase;
+  @include euiFont;
+  @include euiFontSize;
+
+  text-decoration: none;
+  border: solid 1px transparent;
+
+  // sass-lint:disable mixins-before-declarations
+  // focus states should come after all default styles
+  @include euiButtonFocus;
+
+  &:hover:not(:disabled),
+  &:focus {
+    text-decoration: underline;
+  }
+}
+
+// Correctly lays out the contents of a button when using the proper dom elements of:
+// <button>
+//   <span className="__content">
+//     {icon/spinner}
+//     {child}
+//   </span>
+// </button>
 // 1. Apply margin to all but last item in the flex.
 // 2. Margin gets flipped because of the row-reverse.
-
 @mixin euiButtonContent($isReverse: false) {
   height: 100%;
   width: 100%;
diff --git a/src/global_styling/variables/_buttons.scss b/src/global_styling/variables/_buttons.scss
index 887a85cbc3e..79c5810dd20 100644
--- a/src/global_styling/variables/_buttons.scss
+++ b/src/global_styling/variables/_buttons.scss
@@ -2,6 +2,9 @@ $euiButtonHeight: $euiSizeXXL !default;
 $euiButtonHeightSmall: $euiSizeXL !default;
 
 $euiButtonColorDisabled: tintOrShade($euiTextColor, 70%, 70%) !default;
+// Only increase the contrast of background color to text to 2.0 for disabled
+$euiButtonColorDisabledText: makeHighContrastColor($euiButtonColorDisabled, $euiPageBackgroundColor, 2) !default;
+$euiButtonColorGhostDisabled: lightOrDarkTheme($euiColorDarkShade, $euiColorLightShade) !default;
 $euiButtonToggleBorderColor: $euiColorLightShade !default;
 
 // Modifier naming and colors.
diff --git a/src/theme_amsterdam_dark.scss b/src/theme_amsterdam_dark.scss
index 47c18df4ea0..96dbf4a80ed 100644
--- a/src/theme_amsterdam_dark.scss
+++ b/src/theme_amsterdam_dark.scss
@@ -9,3 +9,7 @@
 
 // Packages
 @import '../packages/index';
+
+// Component overrides
+// Comes after the component import and overrides via cascade
+@import 'themes/eui-amsterdam/overrides/index';
diff --git a/src/theme_amsterdam_light.scss b/src/theme_amsterdam_light.scss
index 48b987006b3..15f1bb055ce 100644
--- a/src/theme_amsterdam_light.scss
+++ b/src/theme_amsterdam_light.scss
@@ -9,3 +9,7 @@
 
 // Packages
 @import '../packages/index';
+
+// Component overrides
+// Comes after the component import and overrides via cascade
+@import 'themes/eui-amsterdam/overrides/index';
diff --git a/src/themes/eui-amsterdam/global_styling/index.scss b/src/themes/eui-amsterdam/global_styling/index.scss
index 0c105e46862..cb9a09de94d 100644
--- a/src/themes/eui-amsterdam/global_styling/index.scss
+++ b/src/themes/eui-amsterdam/global_styling/index.scss
@@ -5,6 +5,7 @@
 
 // Variables come next, and are used in some mixins
 @import '../../../global_styling/variables/index';
+@import 'variables/index';
 
 // Mixins provide generic code expansion through helpers
 @import '../../../global_styling/mixins/index';
diff --git a/src/themes/eui-amsterdam/global_styling/mixins/_button.scss b/src/themes/eui-amsterdam/global_styling/mixins/_button.scss
new file mode 100644
index 00000000000..b6a42fdd6d6
--- /dev/null
+++ b/src/themes/eui-amsterdam/global_styling/mixins/_button.scss
@@ -0,0 +1,18 @@
+@mixin euiButton {
+  @include euiButtonBase;
+  @include euiFont;
+  @include euiFontSize;
+
+  font-weight: $euiFontWeightMedium;
+  text-decoration: none;
+  transition: all $euiAnimSpeedNormal $euiAnimSlightBounce;
+
+  // sass-lint:disable mixins-before-declarations
+  // focus states should come after all default styles
+  @include euiButtonFocus;
+
+  &:hover:not(:disabled),
+  &:focus {
+    text-decoration: underline;
+  }
+}
diff --git a/src/themes/eui-amsterdam/global_styling/mixins/_index.scss b/src/themes/eui-amsterdam/global_styling/mixins/_index.scss
index a5b58fb8b6e..e60436f4927 100644
--- a/src/themes/eui-amsterdam/global_styling/mixins/_index.scss
+++ b/src/themes/eui-amsterdam/global_styling/mixins/_index.scss
@@ -1 +1,2 @@
 @import 'panel';
+@import 'button';
diff --git a/src/themes/eui-amsterdam/global_styling/variables/_borders.scss b/src/themes/eui-amsterdam/global_styling/variables/_borders.scss
new file mode 100644
index 00000000000..69a05ac0a3f
--- /dev/null
+++ b/src/themes/eui-amsterdam/global_styling/variables/_borders.scss
@@ -0,0 +1 @@
+$euiBorderRadius: $euiSizeS * .75;
diff --git a/src/themes/eui-amsterdam/global_styling/variables/_buttons.scss b/src/themes/eui-amsterdam/global_styling/variables/_buttons.scss
new file mode 100644
index 00000000000..ae59e94d373
--- /dev/null
+++ b/src/themes/eui-amsterdam/global_styling/variables/_buttons.scss
@@ -0,0 +1 @@
+$euiButtonColorDisabled: tintOrShade($euiTextColor, 75%, 70%);
diff --git a/src/themes/eui-amsterdam/global_styling/variables/_index.scss b/src/themes/eui-amsterdam/global_styling/variables/_index.scss
new file mode 100644
index 00000000000..c129d849cb7
--- /dev/null
+++ b/src/themes/eui-amsterdam/global_styling/variables/_index.scss
@@ -0,0 +1,2 @@
+@import 'buttons';
+@import 'borders';
diff --git a/src/themes/eui-amsterdam/overrides/_button.scss b/src/themes/eui-amsterdam/overrides/_button.scss
new file mode 100644
index 00000000000..eaf54f3ba4f
--- /dev/null
+++ b/src/themes/eui-amsterdam/overrides/_button.scss
@@ -0,0 +1,68 @@
+// This file has lots of modifiers and is somewhat nesty by nature
+//sass-lint:disable nesting-depth
+
+.euiButton {
+  // sass-lint:disable no-important
+  // remove for all states
+  box-shadow: none !important;
+
+  // Added exclusion of the `ghost` type of button
+  // so as not to override those specific styles from default theme
+  // And the only style that needs to change is the non-filled version
+  &:disabled:not(.euiButton--ghost):not(.euiButton--fill) {
+    $backgroundColorSimulated: mix($euiPageBackgroundColor, $euiButtonColorDisabled, 70%);
+    background-color: transparentize($euiButtonColorDisabled, .7);
+    color: makeHighContrastColor($euiButtonColorDisabled, $backgroundColorSimulated, 2);
+  }
+}
+
+.euiButton--small {
+  // Use a moderately smaller radius on small buttons
+  // so that they don't appear completely rounded
+  border-radius: $euiBorderRadius * .667;
+}
+
+// Change the hollow (bordered) buttons to have a transparent background
+// and no border
+@each $name, $color in $euiButtonTypes {
+  .euiButton--#{$name} {
+    // This variable simulates the possibly darkest background the button could be on
+    // Simulates the 20% opaque color on top of the page background color
+    $backgroundColorSimulated: mix($euiPageBackgroundColor, $color, 80%);
+
+    @if ($name == 'ghost') {
+      // Ghost is unique and ALWAYS sits against a dark background.
+      $backgroundColorSimulated: mix($euiColorInk, $color, 70%);
+      color: makeHighContrastColor($color, $backgroundColorSimulated);
+    } @else {
+      // Then we can calculate the darkest text color needed
+      color: makeHighContrastColor($color, $backgroundColorSimulated);
+    }
+
+    // But still use transparency
+    background-color: transparentize($color, .8);
+
+    &:enabled {
+      &:hover,
+      &:focus {
+        background-color: transparentize($color, lightOrDarkTheme(.9, .65));
+      }
+
+      &.euiButton--fill {
+        &:hover,
+        &:focus {
+          background-color: darken($color, 10%);
+        }
+      }
+    }
+  }
+}
+
+// Fix ghost/disabled look specifically
+.euiButton:disabled.euiButton--ghost:not(.euiButton--fill) {
+  &,
+  &:hover,
+  &:focus {
+    background-color: transparentize($euiButtonColorGhostDisabled, .7);
+  }
+}
diff --git a/src/themes/eui-amsterdam/overrides/_button_empty.scss b/src/themes/eui-amsterdam/overrides/_button_empty.scss
new file mode 100644
index 00000000000..030bbe8aefb
--- /dev/null
+++ b/src/themes/eui-amsterdam/overrides/_button_empty.scss
@@ -0,0 +1,16 @@
+.euiButtonEmpty {
+  border-radius: $euiBorderRadius;
+
+  &.euiButtonEmpty--small,
+  &.euiButtonEmpty--xSmall {
+    // Use a moderately smaller radius on small buttons
+    // so that they don't appear completely rounded
+    border-radius: $euiBorderRadius * .667;
+  }
+}
+
+@each $name, $color in $euiButtonTypes {
+  .euiButtonEmpty--#{$name}:enabled:focus {
+    background-color: transparentize($color, lightOrDarkTheme(.9, .8));
+  }
+}
diff --git a/src/themes/eui-amsterdam/overrides/_button_group.scss b/src/themes/eui-amsterdam/overrides/_button_group.scss
new file mode 100644
index 00000000000..7c1ae611abe
--- /dev/null
+++ b/src/themes/eui-amsterdam/overrides/_button_group.scss
@@ -0,0 +1,14 @@
+.euiButtonGroup--compressed {
+  .euiButtonGroup__button {
+    &:not(.euiButtonGroup__button--selected):not(:disabled) {
+      background-color: transparentize($euiColorLightShade, .6);
+    }
+  }
+
+  .euiButtonToggle__input:enabled:hover + .euiButtonGroup__button,
+  .euiButtonToggle__input:enabled:focus + .euiButtonGroup__button,
+  .euiButtonGroup__button--selected {
+    background-color: $euiColorDarkShade;
+    color: $euiColorLightestShade;
+  }
+}
diff --git a/src/themes/eui-amsterdam/overrides/_index.scss b/src/themes/eui-amsterdam/overrides/_index.scss
new file mode 100644
index 00000000000..8188c997879
--- /dev/null
+++ b/src/themes/eui-amsterdam/overrides/_index.scss
@@ -0,0 +1,3 @@
+@import 'button';
+@import 'button_empty';
+@import 'button_group';