Images :
.rounded class adds rounded corners to an image
.rounded-circle class shapes the image to a circle
.img-thumbnail class shapes the image to a thumbnail (bordered)
Aligning Images to the left with the .float-start class or to the right with .float-end
Center an image by adding the utility classes .mx-auto (margin:auto) and .d-block (display:block) to the image
Responsive Images .img-fluid class applies max-width: 100%; and height: auto; to the image

Figures :
Anytime you need to display a piece of content—like an image with an optional caption, consider using a <figure>.
Use the included .figure, .figure-img and .figure-caption classes to provide some baseline styles for the HTML5 <figure> and <figcaption> elements.
Images in figures have no explicit size, so be sure to add the .img-fluid class to your <img> to make it responsive.

<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption text-end">A caption for the above image.</figcaption>
</figure>