# 그룹 이름에 색상 박스 적용

**URL:** https://meta.discourse.org/t/colored-box-for-group-name/130891
**Category:** UX
**Created:** [10월 13, 2019, 10:32오전 UTC](https://meta.discourse.org/t/colored-box-for-group-name/130891 "2019-10-13T10:32:17Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![thecellmc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/thecellmc/32/121055_2.png) [@thecellmc](https://meta.discourse.org/u/thecellmc)
#### Post date: [10월 13, 2019, 10:32오전 UTC](https://meta.discourse.org/t/colored-box-for-group-name/130891/1 "2019-10-13T10:32:17Z")

</div>

안녕하세요,  
여러 포럼에서 스태프 멤버의 그룹 이름 주위에 파란색 박스를 추가하도록 디스커스를 커스터마이징한 것 같더군요. 이걸 어떻게 구현할 수 있는지 아시는 분 계신가요?

몇 가지 예시를 첨부합니다:

 ![00](https://global.discourse-cdn.com/meta/original/3X/5/7/579301bf879be1e3a96ecb76ff3f9d3414b41e72.png) ![10](https://global.discourse-cdn.com/meta/original/3X/6/2/62957e8d6fabd9c96afa4241dbee9e5764f6b6be.png)

---

<div class="post-metadata">

### Author: ![cjk77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cjk77/32/151779_2.png) [@cjk77](https://meta.discourse.org/u/cjk77)
#### Post date: [10월 13, 2019, 10:58오전 UTC](https://meta.discourse.org/t/colored-box-for-group-name/130891/2 "2019-10-13T10:58:37Z")

</div>

이 스레드가 도움이 될 것입니다 – 해당 기법에 대한 CSS를 확인하려면 스레드의 마지막 게시물을 참고하세요:

> [@Background SVG distinguished posts](https://meta.discourse.org/t/background-svg-distinguished-posts/110850):
>
> Hello, Just saying beforehand that I am not good in CSS at all. Blizzard uses discourse for their forums and every employee can distinguish their post with the blizzard logo in the background. I tried to replicate it with CSS but I am not good at that at all. Now I see that Blizzard uses SVGs for that little background logo My approach is awful and since I have my logos in SVGs I prefer it that way, how is it possible? .moderator .regular\>.cooked { background-image: …

구체적으로는 이 부분입니다 👇

```
// This is the user title color
    .group-Employee>article>.row>.topic-body>.topic-meta-data>.names>.user-title {
    background-color: #4c3319;
}

```

---

<div class="post-metadata">

### Author: ![thecellmc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/thecellmc/32/121055_2.png) [@thecellmc](https://meta.discourse.org/u/thecellmc)
#### Post date: [10월 13, 2019, 11:35오전 UTC](https://meta.discourse.org/t/colored-box-for-group-name/130891/3 "2019-10-13T11:35:12Z")

</div>

도움 주셔서 감사합니다.  
이 설정으로 이렇게 보이게 만들 수 있습니다.  
 ![04](https://global.discourse-cdn.com/meta/original/3X/e/3/e3f49a4fa054dd00bf04f93f7df673a45f323ad8.png)

```
.group-Staff>article>.row>.topic-body>.topic-meta-data>.names>.user-title {
  background-color: #66d0fa;
  border-radius: 10%;
  color: #fff;
}

```

텍스트 색상을 흰색으로 변경하는 방법에 대해 아이디어가 있으신가요?