Material-ui: [Avatar] Add shape="square" support

[waheed25]

i want to use Avatar component with square image but default behaviour of avatar in rounded i tried to find a prop for square image but didn't find is there any way to make it square???

[simongavelin]

You can use the style prop and set the borderRadius to 0 instead of 50%.

<Avatar src="images/uxceo-128.jpg" style={{ borderRadius: 0 }} />

[waheed25]

simongavelin thanks it works

[oliviertassinari]

@simongavelin Thanks for answering the question.
@waheed25 Next time, please use Stackoverflow with material-ui tag. It's better suited for it.

[Stabja]

Thanks, best way for me.

[oliviertassinari]

I think that it would be great to add native support for it. What about this API?

variant?: 'round' | 'square';

[mattdotam]

Looks good. I'd like to work on this as my first PR.

I've used material-ui in 4 projects already, and wish to contribute to the project.

[mattdotam]

Added native support using @oliviertassinari's suggested API, see PR #18116.