diff --git a/src/main/java/de/deadlocker8/budgetmaster/charts/ChartController.java b/src/main/java/de/deadlocker8/budgetmaster/charts/ChartController.java
new file mode 100644
index 0000000000000000000000000000000000000000..7fcd4d31427cff363fa90f60ce0b94eefa46ddda
--- /dev/null
+++ b/src/main/java/de/deadlocker8/budgetmaster/charts/ChartController.java
@@ -0,0 +1,33 @@
+package de.deadlocker8.budgetmaster.charts;
+
+import de.deadlocker8.budgetmaster.controller.BaseController;
+import de.deadlocker8.budgetmaster.services.HelpersService;
+import de.deadlocker8.budgetmaster.settings.SettingsService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.RequestMapping;
+
+@Controller
+public class ChartController extends BaseController
+{
+	private final ChartService chartService;
+	private final HelpersService helpers;
+	private final SettingsService settingsService;
+
+	@Autowired
+	public ChartController(ChartService chartService, HelpersService helpers, SettingsService settingsService)
+	{
+		this.chartService = chartService;
+		this.helpers = helpers;
+		this.settingsService = settingsService;
+	}
+
+	@RequestMapping("/charts/edit")
+	public String chartList(Model model)
+	{
+		model.addAttribute("charts", chartService.getRepository().findAllByOrderByNameAsc());
+		model.addAttribute("settings", settingsService.getSettings());
+		return "charts/chartList";
+	}
+}
diff --git a/src/main/java/de/deadlocker8/budgetmaster/controller/EmptyPageController.java b/src/main/java/de/deadlocker8/budgetmaster/controller/EmptyPageController.java
index 48fe0c046d3f794de9a0775b813cdfbcdb7c822b..bb373fb794de2d6b0bb401c14a5c9906c3cc18d9 100644
--- a/src/main/java/de/deadlocker8/budgetmaster/controller/EmptyPageController.java
+++ b/src/main/java/de/deadlocker8/budgetmaster/controller/EmptyPageController.java
@@ -3,8 +3,6 @@ package de.deadlocker8.budgetmaster.controller;
 import de.deadlocker8.budgetmaster.settings.SettingsService;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
-import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.RequestMapping;
 
 
 @Controller
@@ -17,12 +15,4 @@ public class EmptyPageController extends BaseController
 	{
 		this.settingsService = settingsService;
 	}
-
-	@RequestMapping("/charts")
-	public String charts(Model model)
-	{
-		model.addAttribute("active", "charts");
-		model.addAttribute("settings", settingsService.getSettings());
-		return "placeholder/comingSoon";
-	}
 }
\ No newline at end of file
diff --git a/src/main/resources/languages/_de.properties b/src/main/resources/languages/_de.properties
index e924b330f3f2fa04a02613a81dbbfacf5c03322e..e06059a98c0caa60e206f03afe6587303b3ccb8e 100644
--- a/src/main/resources/languages/_de.properties
+++ b/src/main/resources/languages/_de.properties
@@ -43,6 +43,8 @@ title.account.new=Neues Konto
 title.account.edit=Konto bearbeiten
 title.category.budgets=Verbrauch nach Kategorien
 title.filter=Filter
+title.chart.new=Neues Diagramm
+title.chart.edit=Diagramm bearbeiten
 
 # MISC
 category.none=Keine Kategorie
@@ -127,11 +129,6 @@ menu.home=Startseite
 menu.transactions=Buchungen
 menu.categories=Kategorien
 menu.charts=Diagramme
-menu.charts.chartCategories=Eingaben/Ausgaben nach Kategorien
-menu.charts.chartMonth=Eingaben/Ausgaben pro Monat
-menu.charts.chartTags=Eingaben/Ausgaben nach Tags
-menu.charts.chartCategoryBudget=Verbrauch nach Kategorien
-menu.charts.chartHistogram=Histogramm
 menu.reports=Berichte
 menu.settings=Einstellungen
 menu.settings.database=Datenbank
@@ -318,3 +315,13 @@ hotkeys.transactions.filter=Filtern
 hotkeys.transactions.filter.key=f
 hotkeys.search=Suchen
 hotkeys.search.key=s
+
+# charts
+charts.default.test=Test
+charts.default.categories=Eingaben/Ausgaben nach Kategorien
+charts.default.month=Eingaben/Ausgaben pro Monat
+charts.default.categoryBudget=Verbrauch nach Kategorien
+
+chart.new.label.name=Name
+chart.type=Typ
+chart.actions=Aktionen
\ No newline at end of file
diff --git a/src/main/resources/languages/_en.properties b/src/main/resources/languages/_en.properties
index 72222212539be39f0215878acdb2762f1f13c6ab..3ec43f10d079db5e43aaafcc5cd7c8d6ff7d0734 100644
--- a/src/main/resources/languages/_en.properties
+++ b/src/main/resources/languages/_en.properties
@@ -43,6 +43,8 @@ title.account.new=New Account
 title.account.edit=Edit Account
 title.category.budgets=Consumption by categories
 title.filter=Filter
+title.chart.new=New Chart
+title.chart.edit=Edit Chart
 
 # MISC
 category.none=No Category
@@ -127,11 +129,6 @@ menu.home=Home
 menu.transactions=Transactions
 menu.categories=Categories
 menu.charts=Charts
-menu.charts.chartCategories=Income/Payments per Category
-menu.charts.chartMonth=Income/Payments per Month
-menu.charts.chartTags=Income/Payments per Tag
-menu.charts.chartCategoryBudget=Consumption by categories
-menu.charts.chartHistogram=Histogram
 menu.reports=Reports
 menu.settings=Settings
 menu.settings.database=Database
@@ -318,3 +315,13 @@ hotkeys.transactions.filter=Filter
 hotkeys.transactions.filter.key=f
 hotkeys.search=Search
 hotkeys.search.key=s
+
+# charts
+charts.default.test=Test
+charts.default.categories=Income/Payments per Category
+charts.default.month=Income/Payments per Month
+charts.default.categoryBudget=Consumption by categories
+
+chart.new.label.name=Name
+chart.type=Type
+chart.actions=Actions
\ No newline at end of file
diff --git a/src/main/resources/templates/charts/chartFunctions.ftl b/src/main/resources/templates/charts/chartFunctions.ftl
new file mode 100644
index 0000000000000000000000000000000000000000..146874f2e73ff607c5357e0230af3d841f67180f
--- /dev/null
+++ b/src/main/resources/templates/charts/chartFunctions.ftl
@@ -0,0 +1,11 @@
+<#function getChartName chart>
+    <#if chart?? && chart.getName()??>
+        <#if chart.getType().name() == "DEFAULT">
+            <#return locale.getString(chart.getName())>
+        <#else>
+            <#return chart.getName()>
+        </#if>
+    <#else>
+        <#return "">
+    </#if>
+</#function>
\ No newline at end of file
diff --git a/src/main/resources/templates/charts/chartList.ftl b/src/main/resources/templates/charts/chartList.ftl
new file mode 100644
index 0000000000000000000000000000000000000000..6bd402dbd6a7432b15b2a8bf6bfbc561f2d9c84d
--- /dev/null
+++ b/src/main/resources/templates/charts/chartList.ftl
@@ -0,0 +1,84 @@
+<html>
+    <head>
+        <#import "../helpers/header.ftl" as header>
+        <@header.header "BudgetMaster"/>
+        <#import "/spring.ftl" as s>
+    </head>
+    <body class="budgetmaster-blue-light">
+        <#import "../helpers/navbar.ftl" as navbar>
+        <@navbar.navbar "charts" settings/>
+
+        <#import "chartFunctions.ftl" as chartFunctions>
+
+        <main>
+            <div class="card main-card background-color">
+                <div class="container">
+                    <div class="section center-align">
+                        <div class="headline">${locale.getString("menu.charts")}</div>
+                    </div>
+                </div>
+                <br>
+                <div class="center-align"><a href="<@s.url '/charts/newChart'/>" class="waves-effect waves-light btn budgetmaster-blue"><i class="material-icons left">add</i>${locale.getString("title.chart.new")}</a></div>
+                <br>
+                <div class="container">
+                    <table class="bordered">
+                        <#list charts as chart>
+                            <#assign chartName=chartFunctions.getChartName(chart)>
+                            <thead>
+                                <tr>
+                                    <th>${locale.getString("chart.new.label.name")}</th>
+                                    <th>${locale.getString("chart.type")}</th>
+                                    <th>${locale.getString("chart.actions")}</th>
+                                </tr>
+                            </thead>
+                            <tr>
+                                <td>${chartName}</td>
+                                <td>
+                                    <#if chart.getType().name() == "DEFAULT">
+                                        <a class="no-padding text-color"><i class="material-icons left">lock</i></a>
+                                    <#else>
+                                        <a class="no-padding text-color"><i class="material-icons left">person</i></a>
+                                    </#if>
+                                </td>
+                                <td>
+                                    <a href="<@s.url '/charts/${chart.ID?c}/edit'/>" class="btn-flat no-padding text-color"><i class="material-icons left">edit</i></a>
+                                    <#if (chart.getType().name() == "CUSTOM")>
+                                        <a href="<@s.url '/charts/${chart.ID?c}/requestDelete'/>" class="btn-flat no-padding text-color"><i class="material-icons left">delete</i></a>
+                                    </#if>
+                                </td>
+                            </tr>
+                        </#list>
+                    </table>
+                    <#if charts?size == 0>
+                        <div class="headline center-align">${locale.getString("placeholder")}</div>
+                    </#if>
+                </div>
+            </div>
+
+            <#if currentCategory??>
+                <!-- confirm delete modal -->
+                <div id="modalConfirmDelete" class="modal categoryDeleteModal background-color">
+                    <div class="modal-content">
+                        <h4>${locale.getString("info.title.category.delete")}</h4>
+                        <p>${locale.getString("info.text.category.delete", currentCategory.name)}</p>
+                        <p>${locale.getString("info.text.category.delete.move")}</p>
+
+                        <form name="DestinationCategory" id="formDestinationCategory" action="<@s.url '/categories/${currentCategory.ID?c}/delete'/>" method="post">
+                            <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
+                            <#import "../helpers/validation.ftl" as validation>
+                            <@newTransactionMacros.categorySelect availableCategories preselectedCategory "col s12 m12 l8 offset-l2" locale.getString("info.title.category.delete.move")/>
+                        </form>
+                    </div>
+
+                    <div class="modal-footer background-color">
+                        <a href="<@s.url '/categories'/>" class="modal-action modal-close waves-effect waves-light red btn-flat white-text">${locale.getString("cancel")}</a>
+                        <a id="buttonDeleteCategory" class="modal-action modal-close waves-effect waves-light green btn-flat white-text">${locale.getString("delete")}</a>
+                    </div>
+                </div>
+            </#if>
+        </main>
+
+        <#import "../helpers/scripts.ftl" as scripts>
+        <@scripts.scripts/>
+    </body>
+</html>
\ No newline at end of file