Avatar Component

avatar renders an image or generated initials with a stable theme color. It is useful in entity cards and planner row headers.

component: avatar
name: driverAvatar
props:
  name: '{{ row.record.name }}'
  colorSeed: '{{ row.record.contactId }}'
  size: 40

Initials are derived in order from firstName/lastName, name, then email; a generic user icon is used when none is usable. src supplies an image with initials as fallback. colorSeed hashes to a stable theme color, while color, bgcolor, and textColor provide explicit styling. The default size is 40 pixels. skin, variant, tooltip, and onClick are also supported. All display values are template-aware.