one <div>
Cloud
Soft cloud from overlapping circles via box-shadow and pseudo-elements.
<div class="od od-cloud"></div>
.od {
position: relative;
display: block;
box-sizing: border-box;
}
.od::before,
.od::after {
content: '';
position: absolute;
box-sizing: border-box;
}
.od-cloud {
width: 70px; height: 40px; background: #fff; border-radius: 40px;
box-shadow: 0 10px 24px rgba(15,23,42,0.12);
}
.od-cloud::before {
width: 42px; height: 42px; border-radius: 50%; background: #fff; top: -22px; left: 8px;
}
.od-cloud::after {
width: 52px; height: 52px; border-radius: 50%; background: #fff; top: -28px; left: 28px;
}