# Background SVG distinguished posts

**URL:** <https://meta.discourse.org/t/background-svg-distinguished-posts/110850>\
**Category:** Development\
**Created:** [March 6, 2019, 12:14pm UTC](https://meta.discourse.org/t/background-svg-distinguished-posts/110850 "2019-03-06T12:14:17Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![JustinBack](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/justinback/32/133266_2.png) [@JustinBack](https://meta.discourse.org/u/JustinBack)\
**Post date:** [March 6, 2019, 12:14pm UTC](https://meta.discourse.org/t/background-svg-distinguished-posts/110850/1 "2019-03-06T12:14:18Z")

</div>

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.

 ![](https://global.discourse-cdn.com/meta/original/3X/2/1/216ad4fd6055f92e727ccd6da3b715670951bfba.png)

Now I see that Blizzard uses SVGs for that little background logo

 ![](https://global.discourse-cdn.com/meta/original/3X/e/6/e61f2e7e704cf4f719c01e1b3218785e228142f0.png)

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: url("https://cdn.pixelcatproductions.net/f/p/e6921b3dffa0800c866c0fdab5c03cd73b50211aa47d586feb96fe5c9ae66cdc648685cb4e8a00fd440e05dfbb2dc0bb12c7/TransparentBlackText600x600.png");
    padding: 10px;
}

```

---

_[View the full topic](https://meta.discourse.org/t/background-svg-distinguished-posts/110850)._