# How to customize the font of the Notebook title?

**URL:** <https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341>\
**Category:** Support\
**Created:** [12 March 2022 04:36 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341 "2022-03-12T04:36:34Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Enzo](https://avatars.discourse-cdn.com/v4/letter/e/3ab097/32.png) [@Enzo](https://discourse.joplinapp.org/u/Enzo)\
**Post date:** [12 March 2022 04:36 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/1 "2022-03-12T04:36:35Z")

</div>

_(Apologies if this is the wrong place to post this question, please let me know where I could transfer it if so)_

Hello, I am using Joplin 2.7.14 on macOS 11.6.4 Big Sur, and would like to learn how to customize the font of the Notebook title itself (not the body)? I've had success in personalizing the fonts used in the Markdown/Rich Text editors, thanks to the excellent tutorials found here; however, I can't seem to find one for the app itself; I've read the recommended article, "Introduction to customising Joplin (userchrome.css & userstyle.css)" but couldn't find anything about the elements outside the editors (I'm trying to link an image file to show this, but I get denied permission to do this).

Hoping for any help I could get, my sincerest thanks for any suggestions or tips. Cheers!

---

<div class="post-metadata">

**Author:** ![dpoulton](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/dpoulton/32/29723_2.png) [@dpoulton](https://discourse.joplinapp.org/u/dpoulton)\
**Post date:** [12 March 2022 11:02 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/2 "2022-03-12T11:02:22Z")

</div>

@Enzo welcome to the forum.

> [@Enzo](#):
>
> ... but couldn't find anything about the elements outside the editors

The same principle applies to the title text as other elements of the Joplin interface with one important exception!

Using the development tools picker and clicking the title field will show that the element for the title is `input.title-input` (item 1 in picture). However Joplin itself uses the instruction `!important` for this element (item 2 in the picture). This means that no subsequent css should change this setting so it is difficult to override. When looking at the details (item 3 in the picture) you can see that `input.title-input` follows a `div`. It is a quirk of css that using a more specific element than the one marked as `!important` can actually override it.

 ![joplin_dev_tools](https://canada1.discourse-cdn.com/flex028/uploads/cozic/original/2X/6/60e06dcb854954d9d467b0136d02d26bbd69e406.png)

So putting the below in **userchrome.css**...

```css
 div input.title-input {
    /* note title text */
     color: red !important;
}

```

allows this...

![title](https://canada1.discourse-cdn.com/flex028/uploads/cozic/original/2X/5/5490870f8992ecbc68f4960e5d98ae1efd07bb96.png)

I have only briefly tested this by changing the colour. What you can otherwise change may be limited by constraints of the overall layout of Joplin (I am thinking large font sizes, but I may be wrong 🙂 ).

* * *

**EDIT:** I have just typed all this and now realise that you said **Notebook** title not **Note** title. I'll leave it for posterity though and in future I will try to properly read posts before replying 😳

* * *

---

<div class="post-metadata">

**Author:** ![dpoulton](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/dpoulton/32/29723_2.png) [@dpoulton](https://discourse.joplinapp.org/u/dpoulton)\
**Post date:** [12 March 2022 11:28 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/3 "2022-03-12T11:28:41Z")

</div>

I don't have time to check this but try `span.title` for the notebook titles and `span.tag-label` for the tags. Both in **userchrome.css**

---

<div class="post-metadata">

**Author:** ![Enzo](https://avatars.discourse-cdn.com/v4/letter/e/3ab097/32.png) [@Enzo](https://discourse.joplinapp.org/u/Enzo)\
**Post date:** [12 March 2022 11:40 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/4 "2022-03-12T11:40:13Z")

</div>

Actually... I realize now I was using the wrong term. You are correct, and you didn't type in vain—I actually meant **Note** 😁 forgive this noob, so ignorant of proper nomenclature. In my defense, I tried several times to upload or share a link so anybody could see what I was referring to, but I still should've checked my wording, sorry 🙏

Anyway, thanks so much for your tips, over the moon about how well it worked. Really appreciate it 👍

---

<div class="post-metadata">

**Author:** ![Enzo](https://avatars.discourse-cdn.com/v4/letter/e/3ab097/32.png) [@Enzo](https://discourse.joplinapp.org/u/Enzo)\
**Post date:** [12 March 2022 11:43 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/5 "2022-03-12T11:43:57Z")

</div>

I shall! Thanks a bunch, appreciate this. 🖖

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex028/uploads/cozic/original/3X/1/c/1c948e33314e232a0927789508474d8624f4270b.png) [@system](https://discourse.joplinapp.org/u/system)\
**Post date:** [11 April 2022 11:44 UTC](https://discourse.joplinapp.org/t/how-to-customize-the-font-of-the-notebook-title/24341/6 "2022-04-11T11:44:36Z")

</div>

Closed on 11 April 2022 11:44 UTC

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.