diff --git a/src/demo-app/a11y/button/button-a11y.html b/src/demo-app/a11y/button/button-a11y.html
index 875f983c217..999a9c1e7b4 100644
--- a/src/demo-app/a11y/button/button-a11y.html
+++ b/src/demo-app/a11y/button/button-a11y.html
@@ -39,9 +39,9 @@
 
   <section>
     <h2>Buttons in different colors</h2>
-    <button md-button color="primary">Primary</button>
-    <button md-button color="accent">Accent</button>
-    <button md-button color="warn">Warn</button>
+    <button md-button color="primary" (click)="openSnackBar('Color is primary.')">Primary</button>
+    <button md-button color="accent" (click)="openSnackBar('Color is accent.')">Accent</button>
+    <button md-button color="warn" (click)="openSnackBar('Color is warn.')">Warn</button>
   </section>
 
   <section>
diff --git a/src/demo-app/a11y/button/button-a11y.ts b/src/demo-app/a11y/button/button-a11y.ts
index 616e8252d54..aab2e3858c7 100644
--- a/src/demo-app/a11y/button/button-a11y.ts
+++ b/src/demo-app/a11y/button/button-a11y.ts
@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-
+import {MdSnackBar} from '@angular/material';
 
 @Component({
   moduleId: module.id,
@@ -10,7 +10,16 @@ import {Component} from '@angular/core';
 export class ButtonAccessibilityDemo {
   counter: number = 0;
 
+  constructor(public snackBar: MdSnackBar) {}
+
+  openSnackBar(message: string) {
+    this.snackBar.open(message,  '',  {
+      duration: 2000,
+    });
+  }
+
   increase() {
     this.counter++;
+    this.openSnackBar(`Click counter is set to ${this.counter}`);
   }
 }