Image

Images can be made reponsive very easily. Responsive images are images that never becomes wider than their parent container.

Responsive Image

Images can be made responsive by adding img-res to the img element.

Flying Eagle 
              
              <img class="images__res" src="img-url" alt="Flying Eagle"/>
Round Image
Round or circular images are used in lot of place, such as profile picture. You can make image round or circular using round-images class which apply border-radius: 50% to the image element. 
        
      <img class="round-images__images" src="img-url" alt="Eagle"/>
      <img class="round-images__images" src="img-url" alt="Eagle"/>
      <img class="round-images__images" src="img-url" alt="Eagle"/>
Square Image
Eagle Parrot Sparrow 
              
              <img class="sq-images__images" src="img-url" alt="Eagle"/>
              <img class="sq-images__images" src="img-url" alt="Parrot"/>
              <img class="sq-images__images" src="img-url" alt="Sparrow"/>