diff --git a/frontend/favicon.ico b/frontend/favicon.ico
new file mode 100644
index 0000000..6288598
Binary files /dev/null and b/frontend/favicon.ico differ
diff --git a/frontend/img/background.jpg b/frontend/img/background.jpg
index c179474..9f343f8 100644
Binary files a/frontend/img/background.jpg and b/frontend/img/background.jpg differ
diff --git a/frontend/img/background2.jpg b/frontend/img/background2.jpg
deleted file mode 100644
index 9f343f8..0000000
Binary files a/frontend/img/background2.jpg and /dev/null differ
diff --git a/frontend/img/logo.webp b/frontend/img/logo.webp
new file mode 100644
index 0000000..bb6d3a1
Binary files /dev/null and b/frontend/img/logo.webp differ
diff --git a/frontend/index.html b/frontend/index.html
index 271d790..51f3fab 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -8,7 +8,10 @@
 	<body>
 		<main>
 			<div id="title">
-				<h1>Temperature Alarm</h1>
+				<h1>
+					<img id="logo" src="/img/logo.webp" alt="Logo">
+					Temperature Alarm
+				</h1>
 
 				<div id="buttons-wrapper">
 					<a href="/login">
diff --git a/frontend/styles/frontpage.css b/frontend/styles/frontpage.css
index 3de40fe..2ba4e9d 100644
--- a/frontend/styles/frontpage.css
+++ b/frontend/styles/frontpage.css
@@ -6,13 +6,20 @@ body {
 main {
     width: 100vw;
     height: 100vh;
-    background-image: url("/img/background2.jpg");
+    background-image: url("/img/background.jpg");
     background-repeat: no-repeat;
     background-position: center;
     background-size: cover;
     background-color: rgba(255, 255, 255, 0.5);
 }
 
+#logo {
+	height: 1em;
+	position: relative;
+	top: 5px;
+	filter: drop-shadow(3px 3px 6px rgba(0, 0, 0, 0.4));
+}
+
 h1 {
     margin: 0;
     font-size: 4rem;
