About
Profile avatar component with hover effect and inner shadow. Used for personal branding and profile representation.
Interactive
Hover over the avatar to see the effect
States
Default and hover states
Sizes
Available size variants
| Prop | Type | Default | Description |
|---|---|---|---|
hover | boolean | false | Whether the component is in hover state |
size | 'small' | 'medium' | 'large' | 'large' | Size of the avatar |
check_circleWhen to use
- Use for personal profile representation on landing pages
- Use in about sections to add personality to the interface
- Use hover state to provide interactive feedback
cancelWhen not to use
- Don't use for generic user avatars (use Avatar component instead)
- Don't use multiple About components on the same page
- Don't override the image content - it's designed for specific personal branding