diff --git a/apps/theming/js/settings-admin.js b/apps/theming/js/settings-admin.js
index bd4b4b34ed1df..fa94a3d707c9a 100644
--- a/apps/theming/js/settings-admin.js
+++ b/apps/theming/js/settings-admin.js
@@ -41,12 +41,12 @@ function preview(setting, value) {
 		console.log(setting);
 		var logos = document.getElementsByClassName('logo-icon');
 		var timestamp = new Date().getTime();
-		if(value !== '') {
-			logos[0].style.background = "url('" + OC.generateUrl('/apps/theming/logo') + "?v" + timestamp + "')";
-			logos[0].style.backgroundSize = "62px 34px";
+		if (value !== '') {
+			logos[0].style.backgroundImage = "url('" + OC.generateUrl('/apps/theming/logo') + "?v" + timestamp + "')";
+			logos[0].style.backgroundSize = "contain";
 		} else {
-			logos[0].style.background = "url('" + OC.getRootPath() + '/core/img/logo-icon.svg?v' + timestamp +"')";
-			logos[0].style.backgroundSize = "62px 34px";
+			logos[0].style.backgroundImage = "url('" + OC.getRootPath() + '/core/img/logo-icon.svg?v' + timestamp +"')";
+			logos[0].style.backgroundSize = "contain";
 		}
 	}
 }
diff --git a/apps/theming/lib/controller/themingcontroller.php b/apps/theming/lib/controller/themingcontroller.php
index aa35e84a676c1..0dec95cc67747 100644
--- a/apps/theming/lib/controller/themingcontroller.php
+++ b/apps/theming/lib/controller/themingcontroller.php
@@ -221,10 +221,11 @@ public function getStylesheet() {
 		if($logo !== '') {
 			$responseCss .= sprintf('#header .logo {
 				background-image: url(\'./logo?v='.$cacheBusterValue.'\');
+				background-size: contain;
 			}
 			#header .logo-icon {
 				background-image: url(\'./logo?v='.$cacheBusterValue.'\');
-				background-size: 62px 34px;
+				background-size: contain;
 			}'
 			);
 		}
diff --git a/apps/theming/tests/lib/controller/ThemingControllerTest.php b/apps/theming/tests/lib/controller/ThemingControllerTest.php
index 9682e90239fb9..9ce93ec900ae0 100644
--- a/apps/theming/tests/lib/controller/ThemingControllerTest.php
+++ b/apps/theming/tests/lib/controller/ThemingControllerTest.php
@@ -355,10 +355,11 @@ public function testGetStylesheetWithOnlyHeaderLogo() {
 
 		$expected = new Http\DataDownloadResponse('#header .logo {
 				background-image: url(\'./logo?v=0\');
+				background-size: contain;
 			}
 			#header .logo-icon {
 				background-image: url(\'./logo?v=0\');
-				background-size: 62px 34px;
+				background-size: contain;
 			}', 'style', 'text/css');
 		$expected->cacheFor(3600);
 		@$this->assertEquals($expected, $this->themingController->getStylesheet());
@@ -417,10 +418,11 @@ public function testGetStylesheetWithAllCombined() {
 
 		$expected = new Http\DataDownloadResponse('#body-user #header,#body-settings #header,#body-public #header {background-color: #abc}#header .logo {
 				background-image: url(\'./logo?v=0\');
+				background-size: contain;
 			}
 			#header .logo-icon {
 				background-image: url(\'./logo?v=0\');
-				background-size: 62px 34px;
+				background-size: contain;
 			}#body-login {
 				background-image: url(\'./loginbackground?v=0\');
 			}', 'style', 'text/css');
diff --git a/core/css/header.css b/core/css/header.css
index f3f5276c2a44c..c31dd9065c619 100644
--- a/core/css/header.css
+++ b/core/css/header.css
@@ -71,7 +71,7 @@
 	background-image: url('../img/logo-icon.svg?v=1');
 	background-repeat: no-repeat;
 	background-size: 175px;
-	background-position: center 30px;
+	background-position: center;
 	width: 252px;
 	height: 120px;
 	margin: 0 auto;
@@ -82,6 +82,7 @@
 	display: inline-block;
 	background-image: url('../img/logo-icon.svg?v=1');
 	background-repeat: no-repeat;
+	background-position: center center;
 	width: 62px;
 	height: 34px;
 }