diff --git a/index.html b/index.html
index 10dcd6a..9f4305e 100644
--- a/index.html
+++ b/index.html
@@ -10,6 +10,10 @@
 		<details class="ruutu" open>
 			<summary>Luokat</summary>
 			<ul id="luokat-lista"></ul>
+			<form id="luokat-uusi">
+				<input id="luokat-uusi-nimi" type="text" placeholder="luokka">
+				<input type="submit" value="+">
+			</form>
 		</details>
 
 		<details class="ruutu" open>
diff --git a/käyttöliittymä.js b/käyttöliittymä.js
index 454075f..3ef9713 100644
--- a/käyttöliittymä.js
+++ b/käyttöliittymä.js
@@ -4,6 +4,15 @@ document.getElementById('kumoa').addEventListener('click', () => {
 	suorita(_tietokanta.kumoa());
 });
 
+document.getElementById('luokat-uusi').addEventListener('submit', (e) => {
+	e.preventDefault();
+	suorita(_tietokanta.transaktio((t) => {
+		const luokanNimi = document.getElementById('luokat-uusi-nimi').value;
+		t.lisää(taulut.luokat, luokanNimi)
+		document.getElementById('luokat-uusi-nimi').value = '';
+	}));
+});
+
 function suorita([tietokanta, muutokset]) {
 	for (const muutos of muutokset) {
 		suoritaMuutos(tietokanta, muutos);