Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

avatar

v3.9.2arrow_drop_down
v3.9.2
STATUS
Passing
DOWNLOADS
1,303
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
7 months ago
SIZE
20 KB
Avatars are found throughout material design with uses in everything from tables to dialog menus.
1 contributor
Use avatar in your project ?
Copied
npm i @bit/mui-org.material-ui.avatar
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
revert changes
reload
toggle layout
maximize
modifieddraft
modifieddraft
modifieddraft
modifieddraft
chevron_left
chevron_right
Properties
NameTypeDefault valueDescription
alt
string

Used in combination with src or srcSet to provide an alt attribute for the rendered img element.

children
node

Used to render icon or text elements inside the Avatar. src and alt props will not be used and no img will be rendered by default.

This can be an element, or just a string.

childrenClassName
string

The className of the child element. Used by Chip and ListItemIcon to style the Avatar icon.

classes
object

Override or extend the styles applied to the component. See CSS API below for more details.

className
string
component
custom'div'

The component used for the root node. Either a string to use a DOM element or a component.

imgProps
object

Attributes applied to the img element if the component is used to display an image.

sizes
string

The sizes attribute for the img element.

src
string

The src attribute for the img element.

srcSet
string

The srcSet attribute for the img element.