<div class="hashnode"></div>
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: url('https://images.pexels.com/photos/1704120/pexels-photo-1704120.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500') no-repeat center center;
background-size: cover;
}
.hashnode {
width: 5em;
height: 5em;
border-radius: 1.25em;
background: #2962ff;
transform: rotate(45deg);
-webkit-mask: radial-gradient(#0000 28%, #000 28%);
mask: radial-gradient(#0000 28%, #000 28%);
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.