How do I customize a Custom Social Connection Button icon?

Knowledge Articles
, , ,
1

Problem statement:

After I have added a custom social connection, am I able to redesign the orange button logo icon? If so, could you provide some guidance?

Solution

When using the Classic Universal Login, we recommend setting the theme.authButtons in the LockConfiguration Options to your desired button icon. For example:

theme: {
   authButtons: {
     "connectionName": {
       displayName: "Click me!",
       primaryColor: "#eb5424",
       foregroundColor: "#FFFFFF",
       icon: "https://.../logo.png"
     }
   }
 }

Please see our Lock Configuration Options - authButtons documentation to learn more.

Reference Materials: