one <div>
Diamond
Faceted gem built with rotated squares and clipped highlights.
<div class="od od-diamond"></div>
.od {
position: relative;
display: block;
box-sizing: border-box;
}
.od::before,
.od::after {
content: '';
position: absolute;
box-sizing: border-box;
}
.od-diamond {
width: 56px; height: 56px; background: linear-gradient(135deg, #67e8f9, #0284c7);
transform: rotate(45deg); border-radius: 8px;
box-shadow: 0 12px 28px rgba(2,132,199,0.35);
}
.od-diamond::before {
width: 22px; height: 22px; background: rgba(255,255,255,0.55); border-radius: 4px;
top: 8px; left: 8px;
}
.od-diamond::after {
width: 14px; height: 14px; background: rgba(255,255,255,0.35); border-radius: 3px;
right: 10px; bottom: 10px;
}