diff --git a/README.md b/README.md
index 7652f07..56ff96b 100644
--- a/README.md
+++ b/README.md
@@ -109,3 +109,5 @@ Here are the props you can pass to `TreeView`.
 | expandButtonColor | `string`| optional | `'#4B6DAA'` | The color of the expand button |
 | nodeSize| `number`| optional | 20 | The size of the tree leaf icons |
 | nodeIcon| `string`| optional | [blue dot] | The node icon. Must be a base64 imported image |
+| collapsedIcon| `string`| optional | [+ sign] | The collapsed icon. Must be a base64 imported image. Require to set also the `expandedIcon`. |
+| expandedIcon| `string`| optional | [- sign] | The expanded icon. Must be a base64 imported image. Require to set also the `collapsedIcon`. |
diff --git a/public/index.html b/public/index.html
index ed0ebaf..432a0f5 100644
--- a/public/index.html
+++ b/public/index.html
@@ -19,7 +19,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>React Expandable TreeView</title>
   </head>
   <body>
     <noscript>
diff --git a/src/demo/App.js b/src/demo/App.js
index 65e9b66..521f225 100644
--- a/src/demo/App.js
+++ b/src/demo/App.js
@@ -1,6 +1,9 @@
 import React from 'react';
 import TreeView from '../lib';
 import testData from './testData';
+import collapsed from './images/right.png';
+import expanded from './images/down.png';
+import nodeIcon from './images/github.png';
 
 export default class App extends React.Component {
   renderNode(node) {
@@ -10,12 +13,33 @@ export default class App extends React.Component {
   render() {
     return (
       <div style={{ padding: 20 }}>
-      <h1>The <i>Felidae</i> family</h1>
-        <TreeView 
-          data={testData}
-          renderNode={this.renderNode}
-          />
+        <h1>The <i>Felidae</i> family</h1>
+        <div style={{ display: 'flex' }}>
+          <div style={{ width: '50%' }}>
+            <h3>Basic sample</h3>
+            <TreeView
+              data={testData}
+              renderNode={this.renderNode}
+            />
+          </div>
+          <div style={{ width: '50%' }}>
+            <h3>Custom sample</h3>
+            <TreeView
+              data={testData}
+              collapsedIcon={collapsed}
+              expandedIcon={expanded}
+              nodeIcon={nodeIcon}
+              nodeSize={20}
+              lineColor="crimson"
+              lineWidth={1}
+              lineAlpha={1}
+              expandButtonColor="transparent"
+              renderNode={this.renderNode}
+            />
+          </div>
+
+        </div>
       </div>
-    )
+    );
   }
 }
diff --git a/src/demo/images/down.png b/src/demo/images/down.png
new file mode 100644
index 0000000..a8f262f
Binary files /dev/null and b/src/demo/images/down.png differ
diff --git a/src/demo/images/github.png b/src/demo/images/github.png
new file mode 100644
index 0000000..8b25551
Binary files /dev/null and b/src/demo/images/github.png differ
diff --git a/src/demo/images/right.png b/src/demo/images/right.png
new file mode 100644
index 0000000..31f0a23
Binary files /dev/null and b/src/demo/images/right.png differ
diff --git a/src/demo/testData.js b/src/demo/testData.js
index d439e1f..eb06af6 100644
--- a/src/demo/testData.js
+++ b/src/demo/testData.js
@@ -64,6 +64,6 @@ const testData = [
             }
         ]
     },
-]
+];
 
 export default testData;
\ No newline at end of file
diff --git a/src/lib/components/Row.js b/src/lib/components/Row.js
index 5cc774a..dccea1c 100644
--- a/src/lib/components/Row.js
+++ b/src/lib/components/Row.js
@@ -50,6 +50,12 @@ const Square = styled.div`
   font-weight: bold;
 `;
 
+const ExpandCollapse = styled.img`
+  width: ${(props) => props.nodeSize}px;
+  height: ${(props) => props.nodeSize}px;
+  cursor: pointer;
+`;
+
 const NodeIcon = styled.img`
   width: ${(props) => props.nodeSize}px;
 `;
@@ -85,7 +91,7 @@ const HorizontalLine = styled.div`
 const Junction = styled.div`
   width: ${(props) => ((props.nodeSize / 2) + (props.lineWidth * 2))}px;
   height: ${(props) => (props.nodeSize / 2)}px;
-  margin-left: ${(props) => ((props.nodeSize / 2) - props.lineWidth)}px;
+  margin-left: ${(props) => (props.nodeSize / 2)}px;
   border-width: 0 0 ${((props) => props.lineWidth)}px ${(props) => props.lineWidth}px;
   border-color: ${(props) => props.lineColor};
   border-style: ${(props) => props.lineStyle};
@@ -110,9 +116,18 @@ export default class Row extends React.Component {
             lineWidth,
             lineColor,
             lineStyle,
-            lineAlpha
+            lineAlpha,
+            collapsedIcon,
+            expandedIcon,
         } = this.props;
-        if (hasChildren) {
+        if (hasChildren && collapsedIcon && expandedIcon) {
+            return <ExpandCollapse
+                alt={isExpanded ? 'collapse' : 'expand'}
+                src={isExpanded ? expandedIcon : collapsedIcon}
+                onClick={() => onNodeClick(element.id)}
+                nodeSize={nodeSize}
+            />;
+        } else if (hasChildren) {
             return (
                 <Square
                     expandButtonColor={expandButtonColor}
@@ -154,6 +169,8 @@ export default class Row extends React.Component {
             expandButtonColor,
             nodeSize,
             nodeIcon,
+            collapsedIcon,
+            expandedIcon,
         } = this.props;
         const hasChildren = element.children && element.children.length > 0;
         return (
@@ -218,6 +235,8 @@ export default class Row extends React.Component {
                                 expandButtonColor={expandButtonColor}
                                 nodeSize={nodeSize}
                                 nodeIcon={nodeIcon}
+                                collapsedIcon={collapsedIcon}
+                                expandedIcon={expandedIcon}
                             />
                         )
                     )}
diff --git a/src/lib/components/TreeView.js b/src/lib/components/TreeView.js
index 73636a8..97989e0 100644
--- a/src/lib/components/TreeView.js
+++ b/src/lib/components/TreeView.js
@@ -48,6 +48,8 @@ class TreeView extends React.Component {
             expandButtonColor,
             nodeSize,
             nodeIcon,
+            collapsedIcon,
+            expandedIcon,
         } = this.props;
         const { expandedElements } = this.state;
         return (
@@ -69,6 +71,8 @@ class TreeView extends React.Component {
                         expandButtonColor={expandButtonColor}
                         nodeSize={nodeSize}
                         nodeIcon={nodeIcon}
+                        collapsedIcon={collapsedIcon}
+                        expandedIcon={expandedIcon}
                     />
                 ))}
             </div>
@@ -86,6 +90,8 @@ TreeView.propTypes = {
     expandButtonColor: PropTypes.string,
     nodeSize: PropTypes.number,
     nodeIcon: PropTypes.string,
+    collapsedIcon: PropTypes.string,
+    expandedIcon: PropTypes.string,
 };
 
 TreeView.defaultProps = {
