themeColor String (default: 'primary')

The Avatar allows you to specify predefined theme colors for background of its container. The available themeColor values are: - primary (Default) - Applies coloring based on primary theme color. - base - Applies base theme color. - secondary - Applies coloring based on secondary theme color. - tertiary - Applies coloring based on tertiary theme color. - inherit - Applies inherited coloring value. - 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 inverted theme color. - null - Does not apply theme color class.

Example

<div id="avatar"></div>
<script>
    $("#avatar").kendoAvatar({
        text: "IG",
        themeColor: "warning"
    });
</script>
In this article