# Round avatars in topic list?

**URL:** https://meta.discourse.org/t/round-avatars-in-topic-list/27098
**Category:** UX
**Created:** [2 april 2015 om 07:16 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098 "2015-04-02T07:16:18Z")
**Posts on this page:** 20
**Page:** 3

<div class="post-metadata">

### Author: ![Pirat](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pirat/32/62176_2.png) [@Pirat](https://meta.discourse.org/u/Pirat)
#### Post date: [3 april 2015 om 21:11 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/47 "2015-04-03T21:11:44Z")

</div>

I am against such an improvement  
the whole discourse is made in the form of squares, 😔

---

<div class="post-metadata">

### Author: ![smj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/smj/32/122517_2.png) [@smj](https://meta.discourse.org/u/smj)
#### Post date: [3 april 2015 om 21:48 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/48 "2015-04-03T21:48:03Z")

</div>

I suggest `border-radius: 25%;`

Or 20%.

Just 20%.

---

<div class="post-metadata">

### Author: ![Chili](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chili/32/40331_2.png) [@Chili](https://meta.discourse.org/u/Chili)
#### Post date: [4 april 2015 om 01:21 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/50 "2015-04-04T01:21:04Z")

</div>

I like it. There has been a general move towards rounded avatars and profile pictures so this makes a lot of sense. Whatsapp recently changed theirs too, and Windows 10 will use rounded profile pictures as well.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [4 april 2015 om 23:16 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/52 "2015-04-04T23:16:34Z")

</div>

I moved 37 posts to a new topic: [Changing or removing the last poster avatar highlight](https://meta.discourse.org/t/changing-or-removing-the-last-poster-avatar-highlight/27211)

---

<div class="post-metadata">

### Author: ![tar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tar/32/40576_2.png) [@tar](https://meta.discourse.org/u/tar)
#### Post date: [4 april 2015 om 03:42 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/53 "2015-04-04T03:42:50Z")

</div>

I’m going to post this here for anyone who has Stylish installed and wants the square avatars back.

```plaintext
img {
  border-radius: 0px;
}

img.avatar {
  border-radius: 0px;
    
}

```

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [4 april 2015 om 05:28 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/57 "2015-04-04T05:28:00Z")

</div>

Not impossible to do if you don’t mind smaller

\* square diagonal \<= circle diameter

---

<div class="post-metadata">

### Author: ![doudou](https://avatars.discourse-cdn.com/v4/letter/d/5e9695/32.png) [@doudou](https://meta.discourse.org/u/doudou)
#### Post date: [4 april 2015 om 08:24 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/59 "2015-04-04T08:24:10Z")

</div>

looks  
better  
😀

---

<div class="post-metadata">

### Author: ![TechnoBear](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/technobear/32/40546_2.png) [@TechnoBear](https://meta.discourse.org/u/TechnoBear)
#### Post date: [4 april 2015 om 10:59 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/68 "2015-04-04T10:59:32Z")

</div>

Just a comment, but I find it harder to work out at a glance who’s who from the circular avatars. Perhaps it’s because they’re smaller in area. Perhaps because most members set up their avatars to display square, and if they were optimised for circular display there would be less/no problem. Perhaps it’s simply that I’m not yet used to it. Whatever the cause, I’m finding it a bit uncomfortable.

---

<div class="post-metadata">

### Author: ![dkf](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dkf/32/39782_2.png) [@dkf](https://meta.discourse.org/u/dkf)
#### Post date: [4 april 2015 om 17:37 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/80 "2015-04-04T17:37:57Z")

</div>

This sort of visual thing would be fine to have as an option for user avatars (possibly even one enabled by default) but it would be nice if a user could turn it off. It makes things more complicated, but sometimes it’s necessary to get things like _official_ logos right.

As a case in point, forcing a circle would badly mangle the Discourse logo.

Re shadows/glows to indicate the most recent poster, I’m happy enough without that information being anything more than a subtle hint. If I really care, I’ll read the topic…

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [4 april 2015 om 22:00 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/93 "2015-04-04T22:00:23Z")

</div>

The biggest issue I’ve seen probably won’t be for new members because they will notice when they upload a custom avatar and correct for any undesirable effect.

But existing members may not notice that “their heads are chopped” (seems the most common) or that the “design” is off because of missing corners (eg. System avatar) and their avatars will look off to other members until they change them.

---

<div class="post-metadata">

### Author: ![Moter8](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moter8/32/120941_2.png) [@Moter8](https://meta.discourse.org/u/Moter8)
#### Post date: [5 april 2015 om 08:36 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/95 "2015-04-05T08:36:43Z")

</div>

Oh god, you cheated 😛

---

<div class="post-metadata">

### Author: ![soviut](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/soviut/32/107023_2.png) [@soviut](https://meta.discourse.org/u/soviut)
#### Post date: [6 april 2015 om 04:36 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/96 "2015-04-06T04:36:18Z")

</div>

This issue technically already exists since the square avatar shape might cut off edges of portrait or landscape rectangular images. Regardless of square or round avatars, this could be mitigated by having a preview of what the avatar looks like when a user uploads one.

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [6 april 2015 om 04:48 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/97 "2015-04-06T04:48:43Z")

</div>

> [@soviut](#):
>
> mitigated by having a preview of what the avatar looks like when a user uploads one.

There is that. The problem is it _might_ be a problem for those that uploaded _before_ the change to round.

---

<div class="post-metadata">

### Author: ![soviut](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/soviut/32/107023_2.png) [@soviut](https://meta.discourse.org/u/soviut)
#### Post date: [6 april 2015 om 05:04 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/98 "2015-04-06T05:04:41Z")

</div>

> [@Mittineague](#):
>
> There is that. The problem is it _might_ be a problem for those that uploaded _before_ the change to round.

That’s true, but they can still see their rounded avatar in the top right corner of the site to verify if it looks strange or not. Then again, if they’re infrequent visitors, they may not notice it for a long time/ever.

---

<div class="post-metadata">

### Author: ![anon80392659](https://avatars.discourse-cdn.com/v4/letter/a/a9a28c/32.png) [@anon80392659](https://meta.discourse.org/u/anon80392659)
#### Post date: [6 april 2015 om 16:11 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/99 "2015-04-06T16:11:24Z")

</div>

> [@Pirat](#):
>
> the whole discourse is made in the form of squares,

Fix: Round all of the things.  
`* { border-radius:1000px; }`

---

<div class="post-metadata">

### Author: ![kensims](https://avatars.discourse-cdn.com/v4/letter/k/97f17d/32.png) [@kensims](https://meta.discourse.org/u/kensims)
#### Post date: [6 april 2015 om 21:57 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/100 "2015-04-06T21:57:10Z")

</div>

> [@soviut](#):
>
> This issue technically already exists since the square avatar shape might cut off edges of portrait or landscape rectangular images. Regardless of square or round avatars, this could be mitigated by having a preview of what the avatar looks like when a user uploads one.

Does the upload actually crop the image or only adjust how it is displayed? If the former, then any change to the avatar is just a one-time change.

These other changes being discussed are all CSS changes as best I recall, which means that an avatar that was fine to start with may suddenly start being displayed in a way that the user would not like, simply because of an arbitrary CSS change.

---

<div class="post-metadata">

### Author: ![TechnoBear](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/technobear/32/40546_2.png) [@TechnoBear](https://meta.discourse.org/u/TechnoBear)
#### Post date: [7 april 2015 om 10:52 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/102 "2015-04-07T10:52:26Z")

</div>

> [@kensims](#):
>
> These other changes being discussed are all CSS changes as best I recall, which means that an avatar that was fine to start with may suddenly start being displayed in a way that the user would not like, simply because of an arbitrary CSS change.

When I uploaded my avatar originally, I had to redo it to make it square, because otherwise it was cropped to display just the middle section. When circular avatars were introduced, I had to amend it again, because it didn’t fit within the diameter of the circle. I imagine that would be quite a common issue.

---

<div class="post-metadata">

### Author: ![jesselperry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jesselperry/32/119501_2.png) [@jesselperry](https://meta.discourse.org/u/jesselperry)
#### Post date: [8 april 2015 om 03:56 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/103 "2015-04-08T03:56:36Z")

</div>

Anyone else seeing this on the **deleted posts** area of a user when logged in as admin?

 ![](https://global.discourse-cdn.com/meta/original/3X/a/7/a7bf7f879443bd4a04422accc0abf3f087bd42db.png)

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [8 april 2015 om 04:58 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/104 "2015-04-08T04:58:55Z")

</div>

Yes

Though personally, if this is only seen by Mods and this is the only place exhibiting this bug I can live with it.

---

<div class="post-metadata">

### Author: ![elberet](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/elberet/32/122404_2.png) [@elberet](https://meta.discourse.org/u/elberet)
#### Post date: [8 april 2015 om 09:14 UTC](https://meta.discourse.org/t/round-avatars-in-topic-list/27098/105 "2015-04-08T09:14:52Z")

</div>

[https://github.com/discourse/discourse/pull/3348](https://github.com/discourse/discourse/pull/3348)

[Previous page](https://meta.discourse.org/t/round-avatars-in-topic-list/27098.md?page=2)

[Next page](https://meta.discourse.org/t/round-avatars-in-topic-list/27098.md?page=4)
