<div class="skeleton-screen"></div>
.skeleton-screen{
  margin: auto;
  width: 500px;
  height: 500px;

  background-image:
    radial-gradient( circle 50px at 50px 50px, lightgray 100%, transparent 0 ),
    linear-gradient( lightgray 20px, transparent 0px ),
    linear-gradient( lightgray 20px, transparent 0 ),
    linear-gradient( lightgray 20px, transparent 0 ),
    linear-gradient( lightgray 20px, transparent 0 );
  
  background-image:
    -webkit-radial-gradient( 50px 50px, circle cover, lightgray 50px, transparent 0 ),
    -webkit-linear-gradient( lightgray 20px, transparent 0 ),
    -webkit-linear-gradient( lightgray 20px, transparent 0 ),
    -webkit-linear-gradient( lightgray 20px, transparent 0 ),
    -webkit-linear-gradient( lightgray 20px, transparent 0 ); 
  
  background-repeat: repeat-y;

  background-size:
    100px 200px, 
    150px 200px,          
    350px 200px,
    300px 200px,
    250px 200px;

  background-position:
    0 0, 
    120px 0,
    120px 40px,
    120px 80px,
    120px 120px;
}


External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.