border-radius
property
CSS3
Rounds the corners of an element's border. A value of 50% creates a circle.
Syntax
border-radius: value;
Example
css
.slight { border-radius: 4px; }
.medium { border-radius: 8px; }
.large { border-radius: 16px; }
.pill { border-radius: 9999px; }
.circle { border-radius: 50%; }
/* Different corners */
.custom {
border-radius: 16px 4px 16px 4px;
}
.avatar {
width: 60px;
height: 60px;
border-radius: 50%;
object-fit: cover;
}