diff --git a/src/components/fab/fab.ios.scss b/src/components/fab/fab.ios.scss
index 1c6c747c98..5cfa6ca274 100755
--- a/src/components/fab/fab.ios.scss
+++ b/src/components/fab/fab.ios.scss
@@ -21,6 +21,15 @@ $fab-ios-list-button-text-color:                  color-contrast($colors-ios, $f
 /// @prop - Background color of the activated button in a list
 $fab-ios-list-button-background-color-activated:  color-shade($fab-ios-list-button-background-color) !default;
 
+/// @prop - Transition duration of the transform and opacity of the button in a list
+$fab-ios-list-button-transition-duration:         200ms !default;
+
+/// @prop - Speed curve of the transition of the transform and opacity of the button in a list
+$fab-ios-list-button-transition-timing-function:  ease !default;
+
+/// @prop - Transition delay of the transform and opacity of the button in a list
+$fab-ios-list-button-transition-delay:            10ms !default;
+
 
 .fab-ios {
   color: $fab-ios-text-color;
@@ -34,6 +43,9 @@ $fab-ios-list-button-background-color-activated:  color-shade($fab-ios-list-butt
 .fab-ios-in-list {
   color: $fab-ios-list-button-text-color;
   background-color: $fab-ios-list-button-background-color;
+
+  transition: transform $fab-ios-list-button-transition-duration $fab-ios-list-button-transition-timing-function $fab-ios-list-button-transition-delay,
+              opacity $fab-ios-list-button-transition-duration $fab-ios-list-button-transition-timing-function $fab-ios-list-button-transition-delay;
 }
 
 .fab-ios-in-list.activated {
diff --git a/src/components/fab/fab.md.scss b/src/components/fab/fab.md.scss
index 3e73b423d1..a8b2fd45e1 100755
--- a/src/components/fab/fab.md.scss
+++ b/src/components/fab/fab.md.scss
@@ -27,6 +27,15 @@ $fab-md-list-button-text-color:                   color-contrast($colors-md, $fa
 /// @prop - Background color of the activated button in a list
 $fab-md-list-button-background-color-activated:   color-shade($fab-md-list-button-background-color) !default;
 
+/// @prop - Transition duration of the transform and opacity of the button in a list
+$fab-md-list-button-transition-duration:          200ms !default;
+
+/// @prop - Speed curve of the transition of the transform and opacity of the button in a list
+$fab-md-list-button-transition-timing-function:   ease !default;
+
+/// @prop - Transition delay of the transform and opacity of the button in a list
+$fab-md-list-button-transition-delay:             10ms !default;
+
 
 .fab-md {
   color: $fab-md-text-color;
@@ -47,12 +56,25 @@ $fab-md-list-button-background-color-activated:   color-shade($fab-md-list-butto
 .fab-md-in-list {
   color: $fab-md-list-button-text-color;
   background-color: $fab-md-list-button-background-color;
+
+  transition: transform $fab-md-list-button-transition-duration $fab-md-list-button-transition-timing-function $fab-md-list-button-transition-delay,
+              opacity $fab-md-list-button-transition-duration $fab-md-list-button-transition-timing-function $fab-md-list-button-transition-delay,
+              box-shadow $button-md-transition-duration $button-md-transition-timing-function,
+              background-color $button-md-transition-duration $button-md-transition-timing-function,
+              color $button-md-transition-duration $button-md-transition-timing-function;
 }
 
 .fab-md-in-list.activated {
   background-color: $fab-md-list-button-background-color-activated;
 }
 
+// Material Design FAB Ripple
+// --------------------------------------------------
+
+.fab-md .button-effect {
+  background-color: color-contrast($colors-md, $fab-md-background-color);
+}
+
 
 // Generate MD FAB colors
 // --------------------------------------------------
diff --git a/src/components/fab/fab.scss b/src/components/fab/fab.scss
index fb12d37cbb..d084c26568 100755
--- a/src/components/fab/fab.scss
+++ b/src/components/fab/fab.scss
@@ -132,7 +132,7 @@ ion-fab-list {
   min-height: $fab-size;
 }
 
-ion-fab-list .fab-in-list {
+.fab-in-list {
   margin: 8px 0;
 
   width: $fab-mini-size;
@@ -141,12 +141,9 @@ ion-fab-list .fab-in-list {
   opacity: 0;
   visibility: hidden;
   transform: scale(0);
-  transition: all 200ms ease;
-  transition-delay: 10ms;
-  transition-property: transform, opacity;
 }
 
-ion-fab-list .fab-in-list.show {
+.fab-in-list.show {
   opacity: 1;
   visibility: visible;
   transform: scale(1);
diff --git a/src/components/fab/fab.wp.scss b/src/components/fab/fab.wp.scss
index 0c02f55faf..25429f9411 100755
--- a/src/components/fab/fab.wp.scss
+++ b/src/components/fab/fab.wp.scss
@@ -21,6 +21,15 @@ $fab-wp-list-button-text-color:                   color-contrast($colors-wp, $fa
 /// @prop - Background color of the activated button in a list
 $fab-wp-list-button-background-color-activated:   color-shade($fab-wp-list-button-background-color) !default;
 
+/// @prop - Transition duration of the transform and opacity of the button in a list
+$fab-wp-list-button-transition-duration:          200ms !default;
+
+/// @prop - Speed curve of the transition of the transform and opacity of the button in a list
+$fab-wp-list-button-transition-timing-function:   ease !default;
+
+/// @prop - Transition delay of the transform and opacity of the button in a list
+$fab-wp-list-button-transition-delay:             10ms !default;
+
 
 .fab-wp {
   color: $fab-wp-text-color;
@@ -34,6 +43,9 @@ $fab-wp-list-button-background-color-activated:   color-shade($fab-wp-list-butto
 .fab-wp-in-list {
   color: $fab-wp-list-button-text-color;
   background-color: $fab-wp-list-button-background-color;
+
+  transition: transform $fab-wp-list-button-transition-duration $fab-wp-list-button-transition-timing-function $fab-wp-list-button-transition-delay,
+              opacity $fab-wp-list-button-transition-duration $fab-wp-list-button-transition-timing-function $fab-wp-list-button-transition-delay;
 }
 
 .fab-wp-in-list.activated {