HTML SOURCE CODE
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="a.css">
</head>
<body>
<img src="https://images.pexels.com/photos/617278/pexels-photo-617278.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" alt="brown cat with green eyes" width="800">
</body>
</html>
CSS SOURCE CODE
*{
margin: 0;
padding: 0;
box-sizing: border-box;
background: #0a0a0a;}
body {
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;}
img{
animation: fadeIn 5s linear;}
@keyframes fadeIn{
0% {
opacity: 0;
filter: brightness(1) blur(20px);}
10% {
opacity: 1;
filter: brightness(2) blur(10px);}
100% {
opacity: 1;
filter: brightness(1) blur(0);}}
