How to create: avatar images
- Previous page Rounded image
- Next page Responsive image
Learn how to create avatar images using CSS.





How to create avatar images
Step 1 - Add HTML:
<img src="avatar.png" alt="Avatar" class="avatar">
Step 2 - Add CSS:
to set a matching look that is quite nice height
and width
and uses border-radius
The property adds rounded corners to the image.50%
The image will become circular:
.avatar { vertical-align: middle; width: 50px; height: 50px; border-radius: 50%; }
Related pages
Tutorial:CSS image
- Previous page Rounded image
- Next page Responsive image