#e8e8e8
1.card { 2 --bg: #e8e8e8; 3 --contrast: #e2e0e0; 4 --grey: #93a1a1; 5 position: relative; 6 padding: 9px; 7 background-color: var(--bg); 8 border-radius: 35px; 9 box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; 10} 11 12.card-overlay { 13 position: absolute; 14 inset: 0; 15 pointer-events: none; 16 background: repeating-conic-gradient(var(--bg) 0.0000001%, var(--grey) 0.000104%) 60% 60%/600% 600%; 17 filter: opacity(10%) contrast(105%); 18} 19 20.card-inner { 21 display: -webkit-box; 22 display: -ms-flexbox; 23 display: flex; 24 justify-content: center; 25 align-items: center; 26 overflow: hidden; 27 width: 190px; 28 height: 254px; 29 background-color: var(--contrast); 30 border-radius: 30px; 31 /* Content style */ 32 font-size: 30px; 33 font-weight: 900; 34 color: #c7c4c4; 35 text-align: center; 36 font-family: monospace; 37}
Comments
Variations
2JaydipPrajapati1910
369 views
MIT License