diff --git a/web/public/js/tfm-tags.js b/web/public/js/tfm-tags.js
index 4b3665e..935a84c 100644
--- a/web/public/js/tfm-tags.js
+++ b/web/public/js/tfm-tags.js
@@ -38,6 +38,7 @@ $(document).on("dblclick", ".item", function (e) {
 	});
 	$(".item.selected").removeClass("selected");
 	$(".menu-wrapper").css("display", "flex");
+	$("#menu-view").css("display", "flex");
 	$("#name").val(decodeURI(current_tanzaku.name));
 	let resp = tdb_query("$TFM", 40, '' + id);
 	if (!resp.status) {
@@ -62,6 +63,7 @@ $(document).on("click", "#btn-confirm", function (e) {
 		return;
 	}
 	$(".menu-wrapper").css("display", "none");
+	$("#menu-view").css("display", "none");
 	resp.data.forEach(sasa => {
 		let current = $(`#s${sasa.id}`)
 		if (current.hasClass("selected")) {
@@ -79,3 +81,15 @@ $(document).on("click", "#btn-confirm", function (e) {
 	});
 	$(".list-item").removeClass("selected").css("display", "block");
 });
+
+$(document).on("click", "#btn-add", function (e) {
+	e.preventDefault();
+	let resp = tdb_query("$TFM", 34, $("#new-name").val() + '\n' + $("#new-description").val());
+	if (!resp.status) {
+		alert("Something went wrong!");
+		return;
+	}
+	$(".menu-wrapper").css("display", "none");
+	$("#menu-add").css("display", "none");
+	location.reload(true);
+});
diff --git a/web/public/tfm/tags.html b/web/public/tfm/tags.html
index f92470c..ba6447f 100644
--- a/web/public/tfm/tags.html
+++ b/web/public/tfm/tags.html
@@ -40,10 +40,11 @@
 		</div>
 	</form>
 	<div class="contents-wrapper">
+		<button class="btn btn-outline-secondary tanzaku" id="btn-new"><b>NEW</b></button>
 	</div>
 </main>
 <div class="menu-wrapper">
-	<div class="menu">
+	<div class="menu" id="menu-view">
 		<h2>Tag menu</h2>
 		<form>
 			<div class="form-group row">
@@ -52,7 +53,7 @@
 					<input type="text" name="name" class="form-control" id="name">
 				</div>
 			</div>
-			<div class="form-group form-check">
+			<div class="form-group form-check menu-view">
 				<input type="checkbox" name="selection-filter" class="form-check-input" id="selection-filter" checked>
 				<label class="form-check-label" for="selection-filter">Show only selected</label>
 			</div>
@@ -63,6 +64,25 @@
 			</div>
 		</form>
 	</div>
+	<div class="menu" id="menu-add">
+		<h2>New tag</h2>
+		<form>
+			<div class="form-group row">
+				<label class="col-sm-2 col-form-label" for="new-name">Tag name</label>
+				<div class="col-sm-10">
+					<input type="text" name="new-name" class="form-control" id="new-name">
+				</div>
+			</div>
+			<div class="form-group menu-add">
+				<label for="new-description">Tag description</label>
+				<textarea class="form-control" name="new-description" id="new-description" rows="10"></textarea>
+			</div>
+			<div class="form-group button-flex">
+				<button class="btn btn-primary" id="btn-add">Add</button>
+				<button class="btn btn-outline-danger" id="btn-reset">Reset</button>
+			</div>
+		</form>
+	</div>
 </div>
 <script src="/js/tfm-tags.js"></script>
 </body>