In this error page template html5, we integrated to support dynamic colors, when you change the background color, SVG image also change like your background
404 page not found html template free
Free 404 page template code down below,
This error page template built in HTML5 and CSS3
To make this 404 page copy the 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;
background-color: #009044;
color: #ffffff;
}
.error-page{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height:100vh;
font-family: monospace;
}
.error-page p{
font-size:24px;
margin-top: 0;
}
.error-page img{
width:700px;
}
h1{
font-size: 100px;
margin:0;
}
/* mobile responsive code */
@media only screen and (max-width: 600px) {
span{
font-size: 200px!important;
}
h1{
font-size: 80px!important;
}
.error-page p{
text-align: center;
font-size: 15px;
}
.error-page img{
width: 350px;
}
}
</style>
</head>
<body>
<div class="error-page">
<h1>OOPS!</h1>
<p>The page you requested could not be found</p>
<img src="404.svg" alt="404 error page">
</div>
</body>
</html>404 SVG Image
Hope you enjoy this code 🙂