Blog Post - https://www.jitendrazaa.com/blog/salesforce/gravatar-reusable-lightning-web-component/

gravatar.css

.roundImg{
    border-radius: 50%;
}

gravatar.html

<template> 
    <div>
        <img src={imgSrc} class={cssClass}  />
    </div>
</template>

gravatar.js

import { LightningElement, api, track, wire } from 'lwc';
import getMD5Hash from '@salesforce/apex/GravatarController.getMD5Hash';
export default class Gravatar extends LightningElement {
    @api size; 
    @api email;
    @track emailHash = '66f795f030fcc5290902fd41eb7386fe';
    @api isRoundCorner; 
    //Advantage of getter - if any of property changes like size, it would cause rebinding on UI
    get imgSrc(){
        if(!this.size){
            this.size = 150;
        }
        return "https://www.gravatar.com/avatar/"+this.emailHash+"?s="+this.size;
    }
    //Advantage of getter - if any of property changes like isroundedcorner, it would cause rebinding on UI
    get cssClass(){
        if(this.isRoundCorner){
            return 'roundImg';
        }
    }
    @wire( getMD5Hash , {email : '$email'})
    wireMethodCallback({error,data}){
        if(data){
            this.emailHash = data; 
        }
    }
    connectedCallback() {
        // initialize component - equivalent to init method of Aura
    } 
}