diff --git a/ng2-components/ng2-alfresco-documentlist/README.md b/ng2-components/ng2-alfresco-documentlist/README.md
index bd74e10e18..aa927b3730 100644
--- a/ng2-components/ng2-alfresco-documentlist/README.md
+++ b/ng2-components/ng2-alfresco-documentlist/README.md
@@ -10,7 +10,6 @@ npm install --save <TBD>
 
 ```html
 <alfresco-document-list
-    #list
     [thumbnails]="thumbnails"
     [breadcrumb]="breadcrumb"
     [navigate]="navigation"
@@ -56,6 +55,20 @@ Note the use of ```DOCUMENT_LIST_DIRECTIVES``` barrel that consolidates all the
 It gives you access to ```<document-actions>```, ```<folder-actions>``` and many other directives.
 In addition ```DOCUMENT_LIST_PROVIDERS``` exports all primary services and providers needed for component to function.
 
+### Breadcrumb
+
+Document List provides simple breadcrumb element to indicate the current position within a navigation hierarchy.
+It can be enabled via `thumbnails` attribute:
+
+```html
+<alfresco-document-list [thumbnails]="true">
+</alfresco-document-list>
+```
+
+![Breadcrumb](docs/assets/breadcrumb.png)
+
+Parent folder button is not displayed when breadcrumb is enabled.
+
 ### Custom columns
 
 It is possible to reorder, extend or completely redefine data columns displayed by the component.
diff --git a/ng2-components/ng2-alfresco-documentlist/docs/assets/breadcrumb.png b/ng2-components/ng2-alfresco-documentlist/docs/assets/breadcrumb.png
new file mode 100644
index 0000000000..35a0c4b8cc
Binary files /dev/null and b/ng2-components/ng2-alfresco-documentlist/docs/assets/breadcrumb.png differ
diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.css b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.css
index a255757327..44fe79cdb9 100644
--- a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.css
+++ b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.css
@@ -30,4 +30,28 @@
     cursor: pointer;
 }
 
-:host .breadcrumb { margin-bottom: 4px; }
+/* breadcrumb */
+
+:host .breadcrumb {
+    text-align: left;
+    padding: 8px 15px;
+    list-style: none;
+    background-color: #f5f5f5;
+    border-radius: 4px;
+    margin: 0 0 4px;
+}
+
+:host .breadcrumb > li {
+    display: inline-block;
+    box-sizing: border-box;
+}
+
+:host .breadcrumb > li+li:before {
+    content: "/\00a0";
+    padding: 0 0 0 5px;
+    color: #ccc;
+}
+
+:host .breadcrumb > .active {
+    color: #777;
+}