npm install ngx-letter-avatar

person: {
    avatar: {
        url: 'http://www.youravatarurl.com'
    }
    firstName: 'Cem',
    lastName: 'Ezgin,
    // OR
    fullName: 'Cem Ezgin'
}

If the avatar object is null letter avatar is going to generated. You can take first and last name seperate or together.

<letter-avatar person='{{person | json}}'></letter-avatar>

 .shape-avatar {
    width: 55px;
    height:55px;
    border-radius: 50%;
       .letter-avatar {
          padding-top: 18px;
          font-size: 15px;
       }
  }