Files
Maxime Pauvert 81553e8744 docs(avatar/avatar-group): add mask example (#4897)
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
2025-09-08 11:31:13 +02:00

13 lines
452 B
Vue

<template>
<UAvatar class="rounded-none squircle" src="https://avatars.githubusercontent.com/u/739984?v=4" alt="Benjamin Canac" />
</template>
<style>
.squircle {
mask-image: url("data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e");
mask-size: contain;
mask-position: center;
mask-repeat: no-repeat;
}
</style>