A Pen by Stoyan Ivanov.

index.html

<div class="svg-icon svg-icon--cloud"></div>

style.scss

@import "compass/css3";
$cloud-color: rgba(#000, .25);

.svg-icon--cloud {
  background-image: 
  url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMinYMin meet' viewBox='0 0 15 11'><path fill='#{$cloud-color}' d='M12,11H3.5C1.57,11,0,9.43,0,7.5c0-1.398,0.828-2.609,2.016-3.164C2.008,4.227,2,4.109,2,4c0-2.211,1.789-4,4-4c1.672,0,3.102,1.023,3.703,2.484C10.047,2.18,10.5,2,11,2c1.102,0,2,0.898,2,2c0,0.398-0.117,0.766-0.32,1.078C14.008,5.391,15,6.578,15,8C15,9.656,13.656,11,12,11z'></path></svg>");
}
    
.svg-icon {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  width: 100px;
  height: 100px;
  margin: 20px auto;
}