Skip to main content
You can easily customize the appearance of your Universal Auth UI components by targeting their CSS class names. All Universal components include class names starting with the universal- prefix to make styling simple and predictable.

​
How to Style Components

  1. Inspect the Element: In your browser, right-click the Auth UI component you want to style and select Inspect.
  2. Find the Class Name: Look for a class name that starts with universal-.
  3. Write Your Styles: In your CSS, target this class name and add your custom styles.
Example
To make cards in the Credentials Manager have square corners, add the following CSS: 
.universal-ConnectorListItem-root {
  border-radius: 0;
}
That’s it! Your style will automatically apply to all instances of this component. Tip: You can use this method to override any default style—color, spacing, font, etc.—for any Universal Auth UI component.