freeCodeCamp/guide/english/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md

title

title
Make Circular Images with a border-radius

Make Circular Images with a border-radius

---

Problem Explanation

We need to give our cat photo a border-radius of 50%.

---

Solutions

Solution 1 (Click to Show/Hide)

In class smaller-image add a border-radius of 50%:

  .smaller-image {
    width: 100px;
    border-radius: 50%;
  }

This class already assigned to our img element and making it perfectly circular.