Card by Saad3092003
#212121
1.obj { 2 position: relative; 3 width: 200px; 4 height: 200px; 5 /* background-color: rgb(96, 96, 232); */ 6 transform-style: preserve-3d; 7 transition: 0.5s all; 8 transform: rotateX(-25deg) rotateY(20deg); 9} 10 11.objchild { 12 animation: rotate 4s infinite linear; 13 transform-style: preserve-3d; 14 position: absolute; 15 width: 100%; 16 height: 100%; 17 /* background:linear-gradient( to top,rgb(11, 11, 102),rgb(96, 96, 232) ) ; */ 18} 19 20.objchild::after { 21 content: ""; 22 position: absolute; 23 width: 100%; 24 height: 100%; 25 /* background: rgb(37, 101, 230); */ 26 /* background: radial-gradient(center center, farthest-side , #9993, transparent); */ 27 filter: blur(20px); 28 box-shadow: 0 0 200px 15px white; 29 transform: rotateX(90deg) scale(1.1) translateZ(-120px); 30} 31 32.inn1 { 33 position: absolute; 34 width: 100%; 35 height: 100%; 36 border-radius: 30px; 37 filter: blur(2px); 38 transform: translateZ(-250px); 39 background: linear-gradient( to top,rgb(11, 11, 102),rgb(96, 96, 232) ); 40} 41 42.inn2 { 43 position: absolute; 44 width: 100%; 45 height: 100%; 46 transform: translateZ(100px); 47 background: linear-gradient( to top,rgb(11, 11, 102),rgb(96, 96, 232) ); 48} 49 50.inn3 { 51 position: absolute; 52 width: 100%; 53 height: 100%; 54 transform: translateX(-100px) rotateY(90deg); 55 background: linear-gradient( to top,rgb(11, 11, 102),rgb(96, 96, 232) ); 56} 57 58.inn4 { 59 position: absolute; 60 width: 100%; 61 height: 100%; 62 transform: translateX(100px) rotateY(90deg); 63 background: linear-gradient( to top,rgb(10, 10, 78),rgb(96, 96, 232) ); 64} 65 66.inn5 { 67 position: absolute; 68 width: 100%; 69 height: 100%; 70 background: rgb(10, 10, 79); 71 transform: rotateX(90deg) translateZ(-100px); 72} 73 74.inn6 { 75 position: absolute; 76 width: 100%; 77 height: 100%; 78 background: rgb(46, 46, 46); 79 transform: rotateX(90deg) translateZ(100px); 80} 81 82@keyframes rotate { 83 0% { 84 transform: rotate3d(0,1,0,0deg); 85 } 86 87 100% { 88 transform: rotate3d(0,1,0,360deg); 89 } 90}
1.7K views
1.7K views
MIT License