Element: <oj-avatar>

Oracle® JavaScript Extension Toolkit (JET)
17.1.0
G12198-01

DOM Interface: AvatarElement

Version:
  • 17.1.0
Since:
  • 4.0.0
.oj-avatar-group-image
Use to display avatar group placeholder image instead of single person placeholder image.
Example
//Group Placeholder
 <oj-avatar class="oj-avatar-group-image">
 </oj-avatar>

CSS Variables

See JET CSS Variables for additional details.
Avatar Color CSS
CSS variables that specify Avatar colors
Name Type Description
--oj-avatar-bg-color <color> Avatar background color
--oj-avatar-text-color <color> Avatar text color
Avatar Sizing and Display CSS
CSS variables that specify Avatar sizing and display characteristics
Name Type Description
--oj-avatar-pattern-display block | none Avatar pattern display behavior. This is only supported in Redwood.
--oj-avatar-size <length> Avatar size
--oj-avatar-border-radius <length> | <percentage> Avatar border radius, only applied to the square avatar
Avatar Font CSS
CSS variables that specify Avatar font characteristics
Name Type Description
--oj-avatar-initials-font-size <length> Avatar font size for initials
--oj-avatar-initials-font-weight <font_weight> Avatar font weight for initials