ui_suite_daisyui-4.0.x-dev/components/avatar/avatar.component.yml
components/avatar/avatar.component.yml
name: Avatar
description: "Avatars are used to show a thumbnail representation of an individual or business in the interface."
group: "Data display"
links:
- "https://daisyui.com/components/avatar/"
variants:
default:
title: Default
online:
title: Online
offline:
title: Offline
slots:
image:
title: Image
props:
type: object
properties:
size:
title: Size
description: "It is possible to set the size of avatars."
type: string
enum:
- w-8
- w-10
- w-12
- w-16
- w-20
- w-24
- w-28
- w-32
"meta:enum":
w-8: "8"
w-10: "10"
w-12: "12"
w-16: "16"
w-20: "20"
w-24: "24"
w-28: "28"
w-32: "32"
rounded:
title: Rounded
description: "It is possible to set rounded size of avatars."
type: string
enum:
- rounded
- rounded-xl
- rounded-full
"meta:enum":
rounded: Default
rounded-xl: "Extra large"
rounded-full: Full
mask:
title: Mask
description: "It is possible to set mask display to avatars."
type: string
enum:
- mask-squircle
- mask-heart
- mask-hexagon
- mask-hexagon-2
- mask-decagon
- mask-pentagon
- mask-diamond
- mask-square
- mask-circle
- mask-parallelogram
- mask-parallelogram-2
- mask-parallelogram-3
- mask-parallelogram-4
- mask-star
- mask-star-2
- mask-triangle
- mask-triangle-2
- mask-triangle-3
- mask-triangle-4
"meta:enum":
mask-squircle: Squircle
mask-heart: Heart
mask-hexagon: Hexagon
mask-hexagon-2: Hexagon-2
mask-decagon: Decagon
mask-pentagon: Pentagon
mask-diamond: Diamond
mask-square: Square
mask-circle: Circle
mask-parallelogram: Parallelogram
mask-parallelogram-2: Parallelogram-2
mask-parallelogram-3: Parallelogram-3
mask-parallelogram-4: Parallelogram-4
mask-star: Star
mask-star-2: Star-2
mask-triangle: Triangle
mask-triangle-2: Triangle-2
mask-triangle-3: Triangle-3
mask-triangle-4: Triangle-4
ring:
title: Ring
description: "Do you want to set ring around avatar?"
type: boolean
