# Comment rendre les avatars ronds

**URL:** https://meta.discourse.org/t/how-do-i-make-avatars-round/131408
**Category:** Support
**Created:** [Octobre 18, 2019, 11:42 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408 "2019-10-18T23:42:21Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Funkel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/funkel/32/158936_2.png) [@Funkel](https://meta.discourse.org/u/Funkel)
#### Post date: [Octobre 18, 2019, 11:42 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/1 "2019-10-18T23:42:21Z")

</div>

Comment passer de carré à rond ?

 ![imgur](https://global.discourse-cdn.com/meta/original/3X/0/8/08859a83ebdc7e3de204ac117adc654a2931d288.png)

Désolé, je ne sais pas où publier !

---

<div class="post-metadata">

### Author: ![featheredtoast](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/featheredtoast/32/116994_2.png) [@featheredtoast](https://meta.discourse.org/u/featheredtoast)
#### Post date: [Octobre 18, 2019, 11:55 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/2 "2019-10-18T23:55:08Z")

</div>

Sans l’image d’origine, il est difficile de le savoir. Les avatars sont par défaut recadrés en cercle. Cela est probablement dû à une personnalisation de ce site ou au fait que l’image elle-même possède un fond transparent.

---

<div class="post-metadata">

### Author: ![Funkel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/funkel/32/158936_2.png) [@Funkel](https://meta.discourse.org/u/Funkel)
#### Post date: [Octobre 18, 2019, 11:56 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/3 "2019-10-18T23:56:46Z")

</div>

D’accord, alors c’est la personnalisation 😃

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [Avril 3, 2023, 6:28 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/4 "2023-04-03T18:28:40Z")

</div>

je sais que ça fait un moment pour ce sujet, mais je voulais juste ajouter qu’on peut contrôler le degré d’arrondi des avatars en CSS avec le paramètre `border-radius` (j’ai le nôtre à 6px) :

```scss
img.avatar {
  border-radius: 6px;
}

```

plus le nombre est élevé, plus les coins sont arrondis. le régler à 0 rend les avatars parfaitement carrés. je pense que 24px les rend parfaitement ronds. vous pouvez donc être assez précis sur la façon dont vous voulez que les avatars apparaissent. vous pouvez faire en sorte que les avatars carrés ressemblent à des écrans de vieilles télévisions rétro. lol

note : l’arrondi des avatars peut apparaître un peu différent entre les vues de bureau et mobiles, vous voudrez peut-être le contrôler séparément là-bas.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [Avril 3, 2023, 6:55 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/5 "2023-04-03T18:55:03Z")

</div>

Il y a aussi un #Customization > Theme component qui peut être très utile - [Avatar Size and Shape](https://meta.discourse.org/t/avatar-size-and-shape/106124) 👍

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [Avril 3, 2023, 7:15 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/6 "2023-04-03T19:15:35Z")

</div>

Oh, c’est cool, je ne l’avais pas vu. Merci.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [Avril 5, 2023, 7:15 UTC](https://meta.discourse.org/t/how-do-i-make-avatars-round/131408/7 "2023-04-05T19:15:44Z")

</div>

Ce sujet a été automatiquement fermé 2 jours après la dernière réponse. Les nouvelles réponses ne sont plus autorisées.
