# Change the font settings of name of categories on the categories page

**URL:** https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005
**Category:** Development
**Created:** [9월 19, 2019, 10:39오전 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005 "2019-09-19T10:39:13Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![AnkitJain](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ankitjain/32/158153_2.png) [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [9월 19, 2019, 10:39오전 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/1 "2019-09-19T10:39:13Z")

</div>

Please help with css code to change the type of font, color and weight

Thanks for the help.

I did this but it does not change the color:

.category-list tbody  
.category h3 {  
font-weight: 370;  
font-size: 18;  
line-height: 1.9;  
color: teal;  
font-family: Calibre-Regular, Helvetica, Arial, sans-serif;

---

<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: [9월 19, 2019, 11:09오전 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/2 "2019-09-19T11:09:51Z")

</div>

This really depends of what type of category page you chose, for example for categories with topics the code will be something like this:

```css
.category-list.with-topics .category-name {
    font-size: 25px;
    font-weight: normal;
    color: gray;
}

```

You need to use the browser’s inspector to find to CSS class (and parent) that you want to use, see

 ![image](https://global.discourse-cdn.com/meta/original/3X/2/8/280e686cf9018164aacbb2eac6866850850afef9.png)

The parent serves to indicate that you want to change the appearance of the category name only on this page and not globally.

To change the font type see [Change the default font on your site](https://meta.discourse.org/t/how-to-change-default-font-of-your-site/21282/2)

The next time before posting use the search function on the top right and you will surely find the answers you are looking for.

This one instead, [CSS Tutorial](https://www.w3schools.com/css/), is a good place to start learning a bit of CSS.

---

<div class="post-metadata">

### Author: ![AnkitJain](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ankitjain/32/158153_2.png) [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [9월 19, 2019, 11:28오전 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/3 "2019-09-19T11:28:14Z")

</div>

Thanks for the reply.

But the code you gave is not doing the change. The one I gave is doing the changes but not changing the color.

Where am I going wrong?

---

<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: [9월 19, 2019, 12:41오후 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/4 "2019-09-19T12:41:01Z")

</div>

Try with

```css
.category-list .category-name {
    font-weight: 370;
    font-size: 18px;
    line-height: 1.9;
    color: teal;
    font-family: Calibre-Regular, Helvetica, Arial, sans-serif;
} 

```

---

<div class="post-metadata">

### Author: ![AnkitJain](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ankitjain/32/158153_2.png) [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [9월 20, 2019, 1:37오후 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/5 "2019-09-20T13:37:28Z")

</div>

> [@dax](#):
>
> .category-list .category-name { font-weight: 370; font-size: 18px; line-height: 1.9; color: teal; font-family: Calibre-Regular, Helvetica, Arial, sans-serif; }

The code by you changed fonts of name of sub-categories on the main categories page.

This worked:

```
.category-list tbody
.category h3 {
   font-weight: 375;
   font-size: 17px;
   line-height: 21px;
   font-family: "Open Sans", Helvetica, sans-serif;
}

.category-list tbody .category h3 a[href] {
    color: black;
}

```

Thanks a lot for your help. I learnt new things

---

<div class="post-metadata">

### Author: ![AnkitJain](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ankitjain/32/158153_2.png) [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [9월 20, 2019, 1:37오후 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/6 "2019-09-20T13:37:59Z")

</div>

Yes, I am using inspect element feature in firefox to understand the css codes.

Thanks a lot

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [5월 7, 2023, 5:04오후 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/7 "2023-05-07T17:04:06Z")

</div>



---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [5월 7, 2023, 6:15오후 UTC](https://meta.discourse.org/t/change-the-font-settings-of-name-of-categories-on-the-categories-page/129005/8 "2023-05-07T18:15:24Z")

</div>


