Card by Saad3092003
#212121
1.one-div { 2 position: relative; 3 height: 250px; 4 width: 200px; 5 background-color: rgb(15, 15, 15); 6 transform-style: preserve-3d; 7 animation: rot 2s infinite ease; 8 border-radius: 20px; 9 box-shadow: 0 0 50px 0px, inset 0 0 90px 0px; 10 color: white; 11 transition: 1.5s; 12 display: flex; 13 justify-content: center; 14 align-items: center; 15} 16 17.one-div .text { 18 opacity: 0; 19 transition: all 0.5s; 20} 21 22.one-div:hover.one-div .text { 23 scale: 1.2; 24 opacity: 0.7; 25} 26 27.one-div:hover { 28 box-shadow: 0 0 30px 1000px black, inset 5px 5px 5px 0px rgb(31, 31, 31); 29} 30 31@keyframes rot { 32 0% { 33 transform: rotateX(-15deg) translateY(0px); 34 } 35 36 50% { 37 transform: rotateX(-15deg) translateY(-10px); 38 } 39 40 100% { 41 transform: rotateX(-15deg) translateY(0px); 42 } 43} 44
1K views
Variation of acard
MIT License