clip-path部分区域显示，hover曲线出现

.card{

          clip-path: circle(5% at 10% 10%);

          transition: all ease-in-out .3s;

          background-color: red;

          width: 300px;

          height: 300px;

        }

            .card:hover{

                clip-path: circle(75%);

                border-radius: 20px;

                background: red;

            }

<div class="card"></div>