Design WP Login landing page (wp-login.php, wp-login.php?action=lostpassword,etc.)

Design WP Login landing page (wp-login.php, wp-login.php?action=lostpassword,etc.). I’d like to share some CSS code for you, you can enhance it on your own and this is just an example of mine. The 2 screenshot will be the layout output in WP login landing page.

Copy the PHP code to your functions.php of your current WordPress theme folder.

add_action( 'login_header', 'custom_login_header' );
function custom_login_header(){
	?>
    <style>
	#login h1 {
		background-color: #8891a4;
		padding: 30px 0;
	}
	#login h1 a {
		background-image: url('https://simplecottages.ie/wp-content/uploads/2017/12/login-logo.jpg');
		background-size: auto;
		height: 125px;
		width: 125px;
		background-color: #fff;
		background-position: center center;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
	}
	#login .message {border-color: #c7cb4f;}
	#login #nav,
	#login #backtoblog {
		background-color: #f1f3f7 !important;
	}
	#login h1 a,
	#login .message,
	#login form,
	#login #nav,
	#login #backtoblog {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
	#login #nav,
	#login #backtoblog {
		background-color: #8891a4 !important;
		text-align: center;
	}
	#login #nav {
		padding-top: 10px;
	}
	#login #backtoblog {
		padding-bottom: 10px;
	}
	#login #nav a,
	#login #backtoblog a {
		background-color: #c7cb4f !important;
		display: inline-block;
		margin: 10px;
		padding: 0 30px;
		line-height: 40px;
		color: #fff;
		text-transform: uppercase;
	}
    </style>
    <script type="text/javascript" src="<?php echo bloginfo( 'url' ); ?>/wp-includes/js/jquery/jquery.js"></script>
	<script type="text/javascript">
    	jQuery( document ).ready(function($) {
            $( '#login h1' ).remove();
			$( '#login #loginform' ).before( '<h1><a href="<?php echo bloginfo( 'url' ); ?>" title="<?php echo bloginfo( 'name' ); ?>"><?php echo bloginfo( 'name' ); ?></a></h1>' );
        });
    </script>
    <?php
}

Feel free to change the CSS code depending on your style.

Demo URL:

https://simplecottages.ie/wp-login.php
https://www.anthonycarbon.com/wp-login.php
http://www.soundoflondon.co.uk/wp-login.php