#dbd1e4
1.card { 2 width: 250px; 3 height: 200px; 4 border-radius: 15px; 5 background: rgba(105, 13, 197, 0.103); 6 display: flex; 7 flex-direction: column; 8 position: relative; 9 overflow: hidden; 10} 11 12.card::before { 13 content: ""; 14 height: 100px; 15 width: 100px; 16 position: absolute; 17 top: -40%; 18 left: -20%; 19 border-radius: 50%; 20 border: 35px solid rgba(255, 255, 255, 0.102); 21 transition: all .8s ease; 22 filter: blur(.5rem); 23} 24 25.text { 26 flex-grow: 1; 27 padding: 15px; 28 display: flex; 29 flex-direction: column; 30 color: aliceblue; 31 font-weight: 900; 32 font-size: 1.2em; 33} 34 35.subtitle { 36 font-size: .6em; 37 font-weight: 300; 38 color: rgba(240, 248, 255, 0.691); 39} 40 41.icons { 42 display: flex; 43 justify-items: center; 44 align-items: center; 45 width: 250px; 46 border-radius: 0px 0px 15px 15px; 47 overflow: hidden; 48} 49 50.btn { 51 border: none; 52 width: 84px; 53 height: 35px; 54 background-color: rgba(247, 234, 234, 0.589); 55 display: flex; 56 align-items: center; 57 justify-content: center; 58} 59 60.svg-icon { 61 width: 25px; 62 height: 25px; 63 stroke: rgb(38, 59, 126); 64} 65 66.btn:hover { 67 background-color: rgb(247, 234, 234); 68} 69 70.card:hover::before { 71 width: 140px; 72 height: 140px; 73 top: -30%; 74 left: 50%; 75 filter: blur(0rem); 76}
Comments
1Sujanthapast0 22. September at 16:07
22. September at 16:07
good!
MIT License