# How can I customise CSS for each category? (as in having different design for each category)

**URL:** <https://meta.discourse.org/t/how-can-i-customise-css-for-each-category-as-in-having-different-design-for-each-category/35822>\
**Category:** Development\
**Created:** [November 19, 2015, 11:51pm UTC](https://meta.discourse.org/t/how-can-i-customise-css-for-each-category-as-in-having-different-design-for-each-category/35822 "2015-11-19T23:51:54Z")\
**Posts on this page:** 1\
**Showing post:** 9

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [November 26, 2018, 8:33pm UTC](https://meta.discourse.org/t/how-can-i-customise-css-for-each-category-as-in-having-different-design-for-each-category/35822/9 "2018-11-26T20:33:19Z")

</div>

It’s a surprisingly simple customization — they’ve designed their base theme to work well with background images, and the images themselves are applied per-category (and the images are where most of the style comes from). This CSS accomplishes most of the work:

```CSS

// This adds a background color to topic lists, so they're readable when there's a background image
tbody { 
    background-color: rgba(30,30,30,0.8);
}

// This adds a background color to topics that fades on the right 
.posts-wrapper { 
    background: linear-gradient(to right, rgba(31,34,37,0.95) 0%,rgba(0, 0, 0, 0.83) 80%,rgba(0,0,0,0) 100%);
}

body.category-staff { // Replace staff with the name of your category
   background-image: url(https://yourimagehere.jpg); // Add your category-specific background image
}

```

---

_[View the full topic](https://meta.discourse.org/t/how-can-i-customise-css-for-each-category-as-in-having-different-design-for-each-category/35822)._