How do I change or add new BuddyPress profile icons?

The theme adds icons to the profile menu navigation tabs. However if you're using a plugin to add new profile tabs or want to change the existing icons you can do this using CSS. Go to Theme Options > Styling and in the CSS Code box add:

.gp-theme #buddypress #object-nav li a:before {
content: '\f1db';
}
.gp-theme #buddypress #object-nav #activity-personal-li a:before {
content: '\f03a';
}
.gp-theme #buddypress #object-nav #xprofile-personal-li a:before,
.gp-theme.gp-fontawesome5 #buddypress #object-nav #xprofile-personal-li a:before {
content: '\f2c0';
}
.gp-theme #buddypress #object-nav #blog-personal-li a:before,
.gp-theme #buddypress #object-nav #blogs-personal-li a:before {
content: '\f0e8';
}
.gp-theme #buddypress #object-nav #events-personal-li a:before {
content: '\f073';
}
.gp-theme #buddypress #object-nav #notifications-personal-li a:before,
.gp-theme.gp-fontawesome5 #buddypress #object-nav #notifications-personal-li a:before {
content: '\f0a2';
}
.gp-theme #buddypress #object-nav #messages-personal-li a:before,
.gp-theme.gp-fontawesome5 #buddypress #object-nav #messages-personal-li a:before {
content: '\f003';
}
.gp-theme #buddypress #object-nav #friends-personal-li a:before {
content: '\f234';
}
.gp-theme #buddypress #object-nav #groups-personal-li a:before {
content: '\f0c0';
}
.gp-theme #buddypress #object-nav #nav-forum-groups-li a:before,
.gp-theme #buddypress #object-nav #forums-personal-li a:before {
content: '\f27a';
}
.gp-theme #buddypress #object-nav #media-personal-li a:before {
content: '\f008';
}
.gp-theme #buddypress #object-nav #settings-personal-li a:before {
content: '\f013';
}
.gp-theme #buddypress #object-nav #home-groups-li a:before {
content: '\f015';
}
.gp-theme #buddypress #object-nav #members-groups-li a:before,
.gp-theme.gp-fontawesome5 #buddypress #object-nav #members-groups-li a:before {
content: '\f2c0';
}
.gp-theme #buddypress #object-nav #invite-groups-li a:before {
content: '\f0c0';
}
.gp-theme #buddypress #object-nav #media-groups-li a:before {
content: '\f008';
}
.gp-theme #buddypress #object-nav #admin-groups-li a:before {
content: '\f013';
}
.gp-theme #buddypress #object-nav #courses-personal-li a:before,
.gp-theme #buddypress #object-nav #nav-experiences-groups-li a:before {
content: '\f19d';
}

This code controls all the existing tabs. You can replace each icon code above with one of the icon codes here.

If you want to add icons to new tabs you need to use your browser inspector to right click on the icon, select Inspect/Inspect Element and find the ID of the tag.

And then add this ID to your CSS code.

.gp-theme #buddypress #object-nav #groups-personal-li a:before {
content: '\f03a';
}