diff --git a/demos/component-docs/helpers.ts b/demos/component-docs/helpers.ts
index 7a527d507e..a5922b45c1 100644
--- a/demos/component-docs/helpers.ts
+++ b/demos/component-docs/helpers.ts
@@ -33,7 +33,14 @@ import {FormsPage,
         StackedPage} from './forms/forms';
         
 import {IconsPage} from './icons/icons';
-import {ListsPage} from './lists/lists';
+
+import {BasicListsPage,
+        AvatarListsPage,
+        IconListsPage,
+        NoDividersPage,
+        InsetListsPage,
+        ListHeadersPage} from './lists/lists';
+
 import {MenusPage} from './menus/menus';
 import {ModalsPage} from './modals/modals';
 import {NavigationPage} from './navigation/navigation';
@@ -89,7 +96,14 @@ export function getPageFor(hash) {
         'stacked-labels': StackedPage,
 
         'icons': IconsPage,
-        'lists': ListsPage,
+
+        'lists': BasicListsPage,
+        'avatar-list': AvatarListsPage,
+        'icon-list': IconListsPage,
+        'no-dividers': NoDividersPage,
+        'inset-list': InsetListsPage,
+        'list-headers': ListHeadersPage,
+
         'menus': MenusPage,
         'modals': ModalsPage,
         'navigation': NavigationPage,
diff --git a/demos/component-docs/lists/avatar-lists.html b/demos/component-docs/lists/avatar-lists.html
new file mode 100644
index 0000000000..14cbe75fe8
--- /dev/null
+++ b/demos/component-docs/lists/avatar-lists.html
@@ -0,0 +1,10 @@
+
+<ion-navbar *navbar class="show-navbar">
+  <ion-title>Avatar List</ion-title>
+</ion-navbar>
+
+<ion-content class="has-header demo-list-icons">
+  <ion-list >
+  </ion-list>
+</ion-content>
+
diff --git a/demos/component-docs/lists/lists.html b/demos/component-docs/lists/basic-lists.html
similarity index 98%
rename from demos/component-docs/lists/lists.html
rename to demos/component-docs/lists/basic-lists.html
index 441ad87be8..0556504d8a 100644
--- a/demos/component-docs/lists/lists.html
+++ b/demos/component-docs/lists/basic-lists.html
@@ -4,7 +4,7 @@
 </ion-navbar>
 
 <ion-content class="has-header demo-list-icons">
-  <ion-list>
+  <ion-list no-border>
 
     <ion-header>
       Classes
diff --git a/demos/component-docs/lists/icon-lists.html b/demos/component-docs/lists/icon-lists.html
new file mode 100644
index 0000000000..c6270b966e
--- /dev/null
+++ b/demos/component-docs/lists/icon-lists.html
@@ -0,0 +1,10 @@
+
+<ion-navbar *navbar class="show-navbar">
+  <ion-title>Icon List</ion-title>
+</ion-navbar>
+
+<ion-content class="has-header demo-list-icons">
+  <ion-list >
+  </ion-list>
+</ion-content>
+
diff --git a/demos/component-docs/lists/inset-lists.html b/demos/component-docs/lists/inset-lists.html
new file mode 100644
index 0000000000..77174875a6
--- /dev/null
+++ b/demos/component-docs/lists/inset-lists.html
@@ -0,0 +1,10 @@
+
+<ion-navbar *navbar class="show-navbar">
+  <ion-title>Inset List</ion-title>
+</ion-navbar>
+
+<ion-content class="has-header demo-list-icons">
+  <ion-list >
+  </ion-list>
+</ion-content>
+
diff --git a/demos/component-docs/lists/list-headers.html b/demos/component-docs/lists/list-headers.html
new file mode 100644
index 0000000000..51eda156e2
--- /dev/null
+++ b/demos/component-docs/lists/list-headers.html
@@ -0,0 +1,10 @@
+
+<ion-navbar *navbar class="show-navbar">
+  <ion-title>List Headers</ion-title>
+</ion-navbar>
+
+<ion-content class="has-header demo-list-icons">
+  <ion-list >
+  </ion-list>
+</ion-content>
+
diff --git a/demos/component-docs/lists/lists.ts b/demos/component-docs/lists/lists.ts
index 9251ee9b79..6e1224dca8 100644
--- a/demos/component-docs/lists/lists.ts
+++ b/demos/component-docs/lists/lists.ts
@@ -1,10 +1,55 @@
 import {Page} from 'ionic/ionic';
 
 @Page({
-    templateUrl: 'lists/lists.html',
+    templateUrl: 'lists/basic-lists.html',
 })
-export class ListsPage {
+export class BasicListsPage {
     constructor() {
 
     }
 }
+
+@Page({
+    templateUrl: 'lists/inset-lists.html',
+})
+export class InsetListsPage {
+    constructor() {
+
+    }
+}
+
+@Page({
+    templateUrl: 'lists/no-dividers.html',
+})
+export class NoDividersPage {
+    constructor() {
+
+    }
+}
+
+@Page({
+    templateUrl: 'lists/list-headers.html',
+})
+export class ListHeadersPage {
+    constructor() {
+
+    }
+}
+
+@Page({
+    templateUrl: 'lists/icon-lists.html',
+})
+export class IconListsPage {
+    constructor() {
+
+    }
+}
+
+@Page({
+    templateUrl: 'lists/avatar-lists.html',
+})
+export class AvatarListsPage {
+    constructor() {
+
+    }
+}
\ No newline at end of file
diff --git a/demos/component-docs/lists/no-dividers.html b/demos/component-docs/lists/no-dividers.html
new file mode 100644
index 0000000000..187630213a
--- /dev/null
+++ b/demos/component-docs/lists/no-dividers.html
@@ -0,0 +1,10 @@
+
+<ion-navbar *navbar class="show-navbar">
+  <ion-title>No Dividers</ion-title>
+</ion-navbar>
+
+<ion-content class="has-header demo-list-icons">
+  <ion-list >
+  </ion-list>
+</ion-content>
+