visionOS CSS Transition

main.css

/* Fixed background image, replace with css gradient if you are cool */
.cssbackground {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-image: url("bg.png");
   background-size: cover;
   z-index: -1;
}

@keyframes blur-in {
   0% {
      filter: blur(130px);
      opacity: 0;
      transform: scale(1);
   }
   50% {
      transform: scale(1.35);
   }
   ,
   100% {
      filter: blur(0px);
      opacity: 1;
   }
}

/* Apply view transition to .content */
.content {
   animation: blur-in 0.3s ease-out;
}