How do you create a circular image in CSS?

To achieve a circular image in CSS, you can use the border-radius property. First, ensure that the image is square by making the width and height equal, then apply border-radius: 50% to give the image rounded corners, effectively creating a circle. Additionally, to make sure the image fits within the circle without distortion, you can use object-fit: cover to maintain its aspect ratio. For example: img { width: 150px; height: 150px; border-radius: 50%; object-fit: cover; }