diff --git a/modules/core/client/css/core.css b/modules/core/client/css/core.css
index 88950ddafb..f287d94e6c 100644
--- a/modules/core/client/css/core.css
+++ b/modules/core/client/css/core.css
@@ -26,6 +26,12 @@ a:hover .header-profile-image {
   padding-top: 11px !important;
   padding-bottom: 11px !important;
 }
+.user-primary-account {
+  font-size: 30px;
+  top: 10px;
+  right: 10px;
+  position: absolute;
+}
 .error-text {
   display: none;
 }
diff --git a/modules/users/client/views/settings/manage-social-accounts.client.view.html b/modules/users/client/views/settings/manage-social-accounts.client.view.html
index 0296e288a8..1ab606d9f8 100644
--- a/modules/users/client/views/settings/manage-social-accounts.client.view.html
+++ b/modules/users/client/views/settings/manage-social-accounts.client.view.html
@@ -1,6 +1,11 @@
 <section class="row" ng-controller="SocialAccountsController">
   <h3 class="col-md-12 text-center" ng-show="hasConnectedAdditionalSocialAccounts()">Connected social accounts:</h3>
   <div class="col-md-12 text-center">
+    <!-- If the user's provider field (primary) is a social account, show it here -->
+    <div ng-hide="user.provider === 'local'" class="social-account-container">
+      <img ng-src="/modules/users/client/img/buttons/{{user.provider}}.png">
+      <i class="glyphicon glyphicon-check text-success user-primary-account" data-toggle="popover" title="Primary: {{user.provider}}"></i>
+    </div>
     <div ng-repeat="(providerName, providerData) in user.additionalProvidersData" class="social-account-container">
       <img ng-src="/modules/users/client/img/buttons/{{providerName}}.png">
       <a class="btn btn-danger btn-remove-account" ng-click="removeUserSocialAccount(providerName)">