diff --git a/src/js/directives/amount.js b/src/js/directives/amount.js
new file mode 100644
index 000000000..a23069157
--- /dev/null
+++ b/src/js/directives/amount.js
@@ -0,0 +1,85 @@
+'use strict';
+
+/**
+ * @desc amount directive that can be used to display formatted financial values
+ * size-equal attribute is optional, defaults to false.
+ * @example fee = {
+ *  value: 12.49382901,
+ *  currency: 'BCH'
+ * }
+ * @example <amount value="fee.value" currency="fee.currency"></amount>
+ * @example <amount value="fee.value" currency="fee.currency" size-equal="true"></amount>
+ */
+angular.module('bitcoincom.directives')
+  .directive('amount', [
+  '$timeout',
+  function($timeout) {
+    return {
+      restrict: 'E',
+      scope: {
+        value: '=',
+        currency: '=',
+        sizeEqual: '='
+      },
+      templateUrl: 'views/includes/amount.html',
+      controller: ['$scope', function($scope) {
+        if (typeof $scope.sizeEqual == 'undefined') $scope.sizeEqual = false;
+
+        var decimalPlaces = {
+          '0': ['BIF', 'CLP', 'DJF', 'GNF', 'ILS', 'JPY', 'KMF', 'KRW', 'MGA', 'PYG', 'RWF', 'UGX', 'VND', 'VUV', 'XAF', 'XOF', 'XPF'],
+          '3': ['BHD', 'IQD', 'JOD', 'KWD', 'OMR', 'TND'],
+          '8': ['BCH', 'BTC']
+        };
+
+        var numberWithCommas = function(x) {
+          return parseFloat(x).toLocaleString();
+        };
+
+        var buildAmount = function(start, middle, end) {
+          $scope.start = start;
+          $scope.middle = middle;
+          $scope.end = end;
+        };
+
+        var getDecimalPlaces = function(currency) {
+          if (decimalPlaces['0'].indexOf($scope.currency.toUpperCase()) > -1) return '0';
+          if (decimalPlaces['3'].indexOf($scope.currency.toUpperCase()) > -1) return '3';
+          if (decimalPlaces['8'].indexOf($scope.currency.toUpperCase()) > -1) return '8';
+          return '2';
+        };
+
+        switch (getDecimalPlaces($scope.currency)) {
+          case '0':
+            var valueFormatted = numberWithCommas(Math.round(parseFloat($scope.value)));
+            buildAmount(valueFormatted, '', '');
+            break;
+
+          case '2':
+            var valueProcessing = parseFloat(parseFloat($scope.value).toFixed(2));
+            var valueFormatted = numberWithCommas(valueProcessing);
+            buildAmount(valueFormatted, '', '');
+            break;
+
+          case '3':
+            var valueProcessing = parseFloat(parseFloat($scope.value).toFixed(3));
+            var valueFormatted = numberWithCommas(valueProcessing);
+            buildAmount(valueFormatted, '', '');
+            break;
+
+          case '8':
+            var valueFormatted = parseFloat($scope.value).toFixed(8);
+            if (parseFloat($scope.value) == 0) {
+              buildAmount('0', '', '');
+            } else {
+              buildAmount(valueFormatted, '', '');
+              var start = numberWithCommas(valueFormatted.slice(0, -5));
+              var middle = valueFormatted.slice(-5, -2);
+              var end = valueFormatted.substr(valueFormatted.length - 2);
+              buildAmount(start, middle, end);
+            }
+            break;
+        }
+      }]
+    };
+  }
+]);
\ No newline at end of file
diff --git a/src/sass/components/amount.scss b/src/sass/components/amount.scss
new file mode 100644
index 000000000..363d38a20
--- /dev/null
+++ b/src/sass/components/amount.scss
@@ -0,0 +1,35 @@
+.amount {
+  .start,
+  .middle,
+  .end,
+  .currency {
+    display: inline-block;
+  }
+
+  .start {
+    font-size: 1em;
+  }
+
+  .middle {
+    font-size: 0.7857em;
+    margin-left: 5px;
+  }
+
+  .end {
+    font-size: 0.7857em;
+    margin-left: 5px;
+  }
+
+  &.size-equal {
+    .middle,
+    .end {
+      font-size: 1em;
+    }
+  }
+
+  .currency {
+    font-size: 1em;
+    margin-left: 5px;
+    text-transform: uppercase;
+  }
+}
\ No newline at end of file
diff --git a/src/sass/components/components.scss b/src/sass/components/components.scss
new file mode 100644
index 000000000..def6289fa
--- /dev/null
+++ b/src/sass/components/components.scss
@@ -0,0 +1 @@
+@import "amount.scss";
diff --git a/www/views/includes/amount.html b/www/views/includes/amount.html
new file mode 100644
index 000000000..4cf2807ad
--- /dev/null
+++ b/www/views/includes/amount.html
@@ -0,0 +1,4 @@
+<div class="amount"
+  ng-class="{ 'size-equal': sizeEqual }">
+  <span ng-if="start.length > 0" class="start">{{start}}</span><span ng-if="middle.length > 0" class="middle">{{middle}}</span><span ng-if="end.length > 0" class="end">{{end}}</span><span ng-if="currency.length > 0" class="currency">{{currency}}</span>
+</div>
\ No newline at end of file