The best 404 page examples with mobile responsive in pure HTML5 CSS for free
Best 404 page examples
404 page examples code below
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple 404 error page</title>
<style>
body{
padding:0;
}
.error-page{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height:100vh;
font-family: monospace;
gap:40px;
}
span.err{
font-size: 400px;
}
h1{
font-size: 48px;
margin:0;
}
a{
background-color: lightcoral;
padding:10px 50px;
color: #000000;
border-radius: 7px;
box-shadow: 1px 1px 2px #000000;
cursor: pointer;
text-decoration: none;
}
.four{
color:lightcoral
}
/* mobile responsive code */
@media only screen and (max-width: 600px) {
span{
font-size: 100px!important;
}
h1{
font-size: 18px!important;
}
.error-page{
text-align: center;
}
}
</style>
</head>
<body>
<div class="error-page">
<h1>OOPS! - Could not Find it</h1>
<span class="err"><span class="four">4</span>0<span class="four">4</span></span>
<a href="https://owlcoders.com">Go Back</a>
</div>
</body>
</html>Hope this code helps you
For more best 404 page examples visit 404 page examples html