Really simple loading fade-in effect for your website

Sometimes it can look good to gradually fade in a page on website load. It gives a page a nicer feel.

To add a simple fade-in when the page loads, PURE CSS (No Javascript) – add this to your CSS.

body { 
  animation: fadeInAnimation ease 0.5s;
  animation-iteration-count: 1; 
  animation-fill-mode: forwards; 
} 

@keyframes fadeInAnimation { 
  0% { 
      opacity: 0; 
  } 
  100% { 
      opacity: 1; 
   } 
}