# Como aumentar o tamanho dos avatares nos posts sem deixá-los borrados

**URL:** <https://meta.discourse.org/t/how-to-increase-avatars-size-on-posts-without-making-them-blurred/82214>\
**Category:** Development\
**Created:** [Março 5, 2018, 2:01pm UTC](https://meta.discourse.org/t/how-to-increase-avatars-size-on-posts-without-making-them-blurred/82214 "2018-03-05T14:01:46Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![dax](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dax/32/244677_2.png) [@dax](https://meta.discourse.org/u/dax)\
**Post date:** [Março 5, 2018, 2:01pm UTC](https://meta.discourse.org/t/how-to-increase-avatars-size-on-posts-without-making-them-blurred/82214/1 "2018-03-05T14:01:46Z")

</div>

> 📢 ⚠ Este guia está agora obsoleto em favor do componente de tema [Avatar Size and Shape](https://meta.discourse.org/t/avatar-component/106124) ⚠ 📢

> **Conteúdo Original**
>
> ### 1. Aumentar o tamanho e reposicionar o avatar
> 
> Para aumentar o tamanho do avatar de 45px (padrão) para no máximo 120px, adicione o código acima na sua aba `personalizar > temas > Desktop > CSS`  
> (Quero dizer, você realmente precisa de avatares maiores que 120px? 🤯)  
> No exemplo acima, aumentei o tamanho do avatar para `90px` e o reposicionei
> 
> ```plaintext
> /*Aumentar avatares*/
> 
> .topic-avatar {
> width: 90px;
> .avatar {
> width: 90px;
> height: 90px;
> }
> }
> 
> /*Avatares nas respostas incorporadas permanecerão no tamanho padrão,
> aumente ou diminua o tamanho conforme suas necessidades*/
> 
> .embedded-posts .topic-avatar {
> width: 45px;
> img.avatar {
> width: 45px;
> height: 45px;
> }
> }
> ```
> 
> ![](https://global.discourse-cdn.com/meta/original/3X/8/a/8a1c374ef63b23399f762ff4f5b6604c34a9c5e3.png)
> 
> Mas se você usar o flair para os grupos principais, eles ficarão muito pequenos agora
> 
> ![](https://global.discourse-cdn.com/meta/original/3X/f/5/f5add3e861545f9fa8169c477327215a30305ca5.png)
> 
> ### 2. (Opcional) Aumentar o tamanho e reposicionar os flairs
> 
> Vamos aumentar um pouco o flair. Por padrão, ele é de `14px`, eu dobrei o tamanho para `28px`.  
> Dependendo do tamanho dos avatares que você escolheu, você terá que aumentar ou diminuir o tamanho do flair de acordo.
> 
> ```plaintext
> /*Aumentar o tamanho do flair*/
> 
> .topic-avatar .avatar-flair {
> font-size: 28px;
> width: 30px;
> height: 30px;
> }
> 
> /*Mantenha o tamanho padrão nas postagens incorporadas,
> aumente ou diminua o tamanho conforme suas necessidades*/
> 
> .embedded-posts.bottom .topic-avatar .avatar-flair {
> font-size: 14px;
> width: 20px;
> height: 20px;
> }
> ```
> 
> ![](https://global.discourse-cdn.com/meta/original/3X/1/7/1767888ebe9db0498fada29d17282aed6d570c8a.png)
> 
> ### 3. Sem mais avatar desfocado.
> 
> Adicione este script na aba `Desktop > Head`. Lembre-se de alterar o tamanho (‘90’) para o tamanho que você escolheu
> 
> ```plaintext
> <script>
> Discourse._registerPluginCode('0.8', function (api) {
> api.changeWidgetSetting('post-avatar', 'size', '90');
> });
> </script>
> ```
> 
> ![](https://global.discourse-cdn.com/meta/original/3X/a/8/a8f91a78559ad21dca90f13dbc1ccf7f3b3414ea.png)

---

_[View the full topic](https://meta.discourse.org/t/how-to-increase-avatars-size-on-posts-without-making-them-blurred/82214)._