흐르는 배경

<div class="section">
  <h2>흐르는 배경</h2>
</div>
<style>
.section {width: 100%; 
  height: 250px;
  background: linear-gradient(145deg, #00b3f1, #004eff, #9560a8);
  background-size: 400% 400%;
  animation: bg 4s alternate both infinite;}
@keyframes bg {
  0% {background-position: 0% 0%;}
  100% {background-position: 100% 100%;}
}

h2 {text-align: center; color: #fff; padding-top: 50px;}
</style>

인터넷 서핑 중 이쁜 배경 효과를 발견 해당 소스를 정리해 보았다.

출처 - https://www.autoinside.co.kr/main.do