Circle
.circle { 
   width: 100px;
   height: 100px;
   background: #07CAF3; 
   -moz-border-radius: 50px; 
   -webkit-border-radius: 50px; 
   border-radius: 50px;
}



Oval
.oval {
 height: 200px;
 width: 100px;
 background: #07CAF3;
 -moz-border-radius: 50%;
 -webkit-border-radius: 50%;
 border-radius: 50%;
}




Triangle
.triangle {
 height: 0;
 width: 0;
 border-left: 50px solid transparent;
 border-right: 50px solid transparent;
 border-bottom: 100px solid #07CAF3;
}
Triangle




Triangle-Side

.triangle-sided {
 height: 0;
 width: 0;
 border-top: 100px solid #07CAF3;
 border-right: 100px solid transparent;
}
Triangle-side




Rectangle
.rectangle {
   height: 100px;
   width: 200px; 
   background: #07CAF3;
}
Rectangle



Parallelogram
.parallelogram {
   height: 75px;
   width: 150px; 
   background: #07CAF3;
   -webkit-transform: skew(20deg); 
   -moz-transform: skew(20deg); 
   -o-transform: skew(20deg);
   transform: skew(20deg);
}
parellelogram



Trapezoid
.trapezoid {
 height: 0;
 width: 100px;
 border-bottom: 100px solid #07CAF3;
 border-left: 50px solid transparent;
 border-right: 50px solid transparent;
}
Trapezoid


Cone
.cone {
  height: 0;
  width: 0;
  border-left: 100px solid transparent;
  border-right: 100px solid transparent;
  border-top: 100px solid #07CAF3;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

Cone