diff --git a/web/account.html b/web/account.html
index 5059f87..676cdf4 100644
--- a/web/account.html
+++ b/web/account.html
@@ -29,9 +29,7 @@
         <td>
             <a href="transaction/{{.ID}}">{{.Memo}}</a>
         </td>
-        <td style="text-align: right;{{if .Amount.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Amount.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Amount}}
     </tr>
     {{end}}
 </table>
diff --git a/web/amount.tpl b/web/amount.tpl
new file mode 100644
index 0000000..1f6a9c6
--- /dev/null
+++ b/web/amount.tpl
@@ -0,0 +1,11 @@
+{{define "amount"}}
+        <span class="right {{if .GetPositive}}{{else}}negative{{end}}">
+            {{printf "%.2f" .GetFloat64}}
+        </span>
+{{end}}
+
+{{define "amount-cell"}}
+        <td class="right {{if .GetPositive}}{{else}}negative{{end}}">
+            {{printf "%.2f" .GetFloat64}}
+        </td>
+{{end}}
\ No newline at end of file
diff --git a/web/budget-sidebar.tpl b/web/budget-sidebar.tpl
index e8e1c86..a88bd06 100644
--- a/web/budget-sidebar.tpl
+++ b/web/budget-sidebar.tpl
@@ -9,7 +9,7 @@
                         {{range .Accounts}}
                                 <li>
                                         <a href="/budget/{{$.Budget.ID}}/account/{{.ID}}">{{.Name}}</a>
-                                        <span class="right">{{printf "%.2f" .Balance.GetFloat64}}</span>
+                                        {{template "amount" .Balance}}
                                 </li>
                         {{end}}
                         <li>
diff --git a/web/budget.html b/web/budget.html
index ca7d443..84c83cf 100644
--- a/web/budget.html
+++ b/web/budget.html
@@ -24,9 +24,7 @@
         <td>
             <a href="transaction/{{.ID}}">{{.Memo}}</a>
         </td>
-        <td style="text-align: right;{{if .Amount.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Amount.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Amount}}
     </tr>
     {{end}}
 </table>
diff --git a/web/budgeting.html b/web/budgeting.html
index ea84b95..a8ac940 100644
--- a/web/budgeting.html
+++ b/web/budgeting.html
@@ -28,12 +28,8 @@
         </td>
         <td>
         </td>
-        <td style="text-align: right;{{if .Balance.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Balance.GetFloat64}}
-        </td>
-        <td style="text-align: right;{{if .Activity.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Activity.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Balance}}
+        {{template "amount-cell" .Activity}}
     </tr>
     {{end}}
 </table>
diff --git a/web/static/css/main.css b/web/static/css/main.css
index 4c97039..3e68448 100644
--- a/web/static/css/main.css
+++ b/web/static/css/main.css
@@ -59,4 +59,8 @@ body {
 
 .right {
     text-align: right;
+}
+
+.negative {
+    color: #d50000;
 }
\ No newline at end of file