# Dark Notebook List Despite Light Theme

**URL:** <https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306>\
**Category:** Support\
**Created:** [19 August 2023 14:09 UTC](https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306 "2023-08-19T14:09:19Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ellsinore](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/ellsinore/32/7304_2.png) [@Ellsinore](https://discourse.joplinapp.org/u/Ellsinore)\
**Post date:** [19 August 2023 14:09 UTC](https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306/1 "2023-08-19T14:09:19Z")

</div>

Joplin 2.11.11 (prod, win32)  
Client ID: d641949bd24c4fb2b709fac5318b6280  
Sync Version: 3  
Profile Version: 43  
Keychain Supported: Yes  
Revision: 6886f6f  
Windows 10

I've tried different themes, but the Notebooks list is always black and the number of notes grey -- I can't read it. How do I get this area "light?"

Thanks!

---

<div class="post-metadata">

**Author:** ![personalizedrefriger](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/personalizedrefriger/32/13210_2.png) [@personalizedrefriger](https://discourse.joplinapp.org/u/personalizedrefriger)\
**Post date:** [21 August 2023 21:55 UTC](https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306/2 "2023-08-21T21:55:07Z")

</div>

Ideally, one of Joplin's built-in themes would have a light sidebar.

As a workaround, one way to change the sidebar color is with custom CSS.

To add custom CSS,

1. Navigate to Joplin's settings and click "Appearance".
2. Click "Custom stylesheet for Joplin-wide app styles":  
 ![screenshot: Custom stylesheet for Joplin-wide app styles button focused](https://canada1.discourse-cdn.com/flex028/uploads/cozic/original/3X/c/f/cf7adc6c471a3b67174811868f14a374c9ab8ed4.png)
3. Add CSS similar to the following in the editor that appears:

```auto
/* ".rli-sideBar .sidebar" selects the leftmost sidebar */
.rli-sideBar .sidebar {
  /* Makes the sidebar have a white background. */
  background-color: white;
}

/* Give everything in the sidebar a black foreground color. */
.rli-sideBar .sidebar * {
  color: black;
}

/* Gives the currently selected notebook in the sidebar an orange background */
.rli-sideBar .sidebar div.selected > * {
  background-color: orange;
}

```

1. Save and exit Joplin.

---

<div class="post-metadata">

**Author:** ![Ellsinore](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/ellsinore/32/7304_2.png) [@Ellsinore](https://discourse.joplinapp.org/u/Ellsinore)\
**Post date:** [22 August 2023 03:36 UTC](https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306/3 "2023-08-22T03:36:33Z")

</div>

I knew it had to be the CSS but no clue as to the proper elements.

That did it! Thank you!

---

<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:** [21 September 2023 03:36 UTC](https://discourse.joplinapp.org/t/dark-notebook-list-despite-light-theme/32306/4 "2023-09-21T03:36:50Z")

</div>

Closed on 21 September 2023 03:36 UTC

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