I am creating a project management application that allows users to create profiles and optionally add profile pictures to their profile. I’m using Chakra Ui as my component library. In many parts of the application, a user is represented by a Chakra Ui avatar that is supposed to display a users profile picture if there is one, and if not, display their initials with a random background color. The issue I’m having is that sometimes if a user does not have a profile picture, then the avatar displays their initials but there is no background color (it’s just white). I can manually add a background color which works, but this means that every avatar without a profile picture has the exact same background color. I want the random color feature of the Chakra avatar to work as intended.