diff --git a/core/css/inputs.css b/core/css/inputs.css
index b58310a5c5851d1834543de0d88c4b32cc781aa4..ebde986d584c90f111733aefb45294e46ad5ff43 100644
--- a/core/css/inputs.css
+++ b/core/css/inputs.css
@@ -310,3 +310,17 @@ input:disabled+label, input:disabled:hover+label, input:disabled:focus+label {
 	background-color: #00a2e9;
 	color: #bbb;
 }
+
+@keyframes shake {
+	0% { transform: translate(-5px, 0); }
+	20% { transform: translate(5px, 0); }
+	40% { transform: translate(-5px, 0); }
+	60% { transform: translate(5px, 0); }
+	80% { transform: translate(-5px, 0); }
+	100% { transform: translate(5px, 0); }
+}
+.shake {
+	animation-name: shake;
+	animation-duration: .3s;
+	animation-timing-function: ease-out;
+}
diff --git a/core/templates/login.php b/core/templates/login.php
index 95c5a423c3ded3c28fc6e8628a6725e08cc869a5..c5453c344971c76800bfa64e3a1eacf835f6060a 100644
--- a/core/templates/login.php
+++ b/core/templates/login.php
@@ -38,7 +38,7 @@ script('core', [
 			<!-- the following div ensures that the spinner is always inside the #message div -->
 			<div style="clear: both;"></div>
 		</div>
-		<p class="grouptop">
+		<p class="grouptop<?php if (!empty($_['invalidpassword'])) { ?> shake<?php } ?>">
 			<input type="text" name="user" id="user"
 				placeholder="<?php p($l->t('Username or email')); ?>"
 				value="<?php p($_['loginName']); ?>"
@@ -47,7 +47,7 @@ script('core', [
 			<label for="user" class="infield"><?php p($l->t('Username or email')); ?></label>
 		</p>
 
-		<p class="groupbottom">
+		<p class="groupbottom<?php if (!empty($_['invalidpassword'])) { ?> shake<?php } ?>">
 			<input type="password" name="password" id="password" value=""
 				placeholder="<?php p($l->t('Password')); ?>"
 				<?php p($_['user_autofocus'] ? '' : 'autofocus'); ?>