What is KendoReact
    Components
    • Animation
    • Buttons
    • Charts
    • Common Utilities
    • Conversational UI
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdowns
    • Editor
    • Excel Export
    • File Saver
    • Form
    • Gantt
    • Gauges
    • Grid
    • Indicators
    • Inputs
    • Labels
    • Layout
    • ListBox
    • ListView
    • Notification
    • PDF Processing
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • Sortable
    • Tooltip
    • TreeList
    • TreeView
    • Upload
    Sample Applications
    Styling & Themes
    Common Features
    Project Setup
    Knowledge Base
    Changelog
    Copyright
Components / Layout / API / AvatarProps / 

AvatarProps

border?

boolean

Sets a border to the Avatar.

children?

React.ReactNode

Sets the Avatar children elements.

className?

string

Add additional classes to the Avatar.

fill?

avatarFill | string

Specifies the appearance fill style of the Avatar.

The possible values are:

  • solid (Default)
  • outline

shape?

avatarShape | string

Set the shape of the Avatar.

The supported values are:

  • (Default) square
  • circle
  • rounded

size?

avatarSize | string

Specifies the size of the Avatar

The possible values are:

  • small
  • medium (Default)
  • large

style?

CSSProperties

Sets additional CSS styles to the Avatar.

themeColor?

avatarThemeColor | string

Specifies the theme color of the Avatar.

The possible values are:

  • primary (Default)—Applies coloring based on primary theme color.
  • secondary—Applies coloring based on secondary theme color.
  • tertiary— Applies coloring based on tertiary theme color.
  • info—Applies coloring based on info theme color.
  • success— Applies coloring based on success theme color.
  • warning— Applies coloring based on warning theme color.
  • error— Applies coloring based on error theme color.
  • dark— Applies coloring based on dark theme color.
  • light— Applies coloring based on light theme color.
  • inverse— Applies coloring based on inverse theme color.
  • inherit— Applies inherited coloring value.

type?

avatarType | string

Set the type of the Avatar.

The supported values are:

  • image
  • text
  • icon
Previous
avatarFill
Next
avatarShape

In this article

Not finding the help you need?

Contact Support