# Custom CSS for jupyterhub-singleuser

**URL:** <https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036>\
**Category:** JupyterHub\
**Created:** [July 18, 2024, 10:01am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036 "2024-07-18T10:01:48Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![pgosek](https://avatars.discourse-cdn.com/v4/letter/p/47e85d/32.png) [@pgosek](https://discourse.jupyter.org/u/pgosek)\
**Post date:** [July 18, 2024, 10:01am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/1 "2024-07-18T10:01:48Z")

</div>

I’m trying to add some simple custom css to my jupyter images.  
I’ve created .jupyter/custom/custom.css and put it in config dir, but when I`m trying to launch “jupyterhub-singleuser --custom-css”, it says its an unrecognized argument.  
Is there any way to use custom css with singleuser instances?

```auto
jupyterhub-singleuser --version
4.1.5

```

---

<div class="post-metadata">

**Author:** ![krassowski](https://yyz1.discourse-cdn.com/flex031/user_avatar/discourse.jupyter.org/krassowski/32/1685_2.png) [@krassowski](https://discourse.jupyter.org/u/krassowski)\
**Post date:** [July 18, 2024, 11:45am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/2 "2024-07-18T11:45:54Z")

</div>

`--custom-css` is Jupyter **Lab** , not Jupyter **Hub** flag - it requires appropriate version of jupyterlab to be installed.

I would personally try to set `c.LabApp.custom_css = True` in an appropriate configuration file (though of top of my head I cannot point you as to where you would place it in a JupyterHub setup).

---

<div class="post-metadata">

**Author:** ![manics](https://yyz1.discourse-cdn.com/flex031/user_avatar/discourse.jupyter.org/manics/32/85_2.png) [@manics](https://discourse.jupyter.org/u/manics)\
**Post date:** [July 18, 2024, 1:43pm UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/3 "2024-07-18T13:43:19Z")

</div>

You can put the config in the same locations as you would when running jupyter-lab directly (e.g. in your home directory)

---

<div class="post-metadata">

**Author:** ![pgosek](https://avatars.discourse-cdn.com/v4/letter/p/47e85d/32.png) [@pgosek](https://discourse.jupyter.org/u/pgosek)\
**Post date:** [July 19, 2024, 6:34am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/4 "2024-07-19T06:34:00Z")

</div>

> [@krassowski](#):
>
> c.LabApp.custom\_css = True

Probably I’m missing something. So maybe I`ll add more details.

I’m using JupyterHub 4.1.5, which uses dockerspawner:  
`c.JupyterHub.spawner_class = 'dockerspawner.DockerSpawner'`  
With mounted volume for users data:

```auto
c.DockerSpawner.volumes = {
      '/appl/user_settings/{username}': '/home/jovyan'
}

```

In that mounted dir I have my custom CSS:

```auto
cat /appl/user_settings/{username}/.jupyter/custom/custom.css
.jp-jupyter-icon-color[fill]{
  fill: #26f32e
}

```

I have added:  
`c.LabApp.custom_css = True`  
to my jupyterhub config, but that changes nothing.

Jupyter icon is still orange and my goal was to have it in different color, depending on my environment.

I almost forgot Dockerfile for my image:

```auto
FROM python:3.9.18-slim-bullseye

RUN pip3 install --upgrade pip && \
    pip3 install jupyterhub && \
    pip3 install jupyterlab && \
    pip3 install itables && \
    pip3 install ipywidgets && \
    pip3 install ipydatagrid && \
    rm -rf /root/.cache

RUN useradd -u 1000 jovyan
ENV HOME=/home/jovyan
WORKDIR $HOME
USER jovyan

CMD ["jupyterhub-singleuser"]

```

---

<div class="post-metadata">

**Author:** ![krassowski](https://yyz1.discourse-cdn.com/flex031/user_avatar/discourse.jupyter.org/krassowski/32/1685_2.png) [@krassowski](https://discourse.jupyter.org/u/krassowski)\
**Post date:** [July 19, 2024, 8:36am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/5 "2024-07-19T08:36:46Z")

</div>

> I have added:  
> c.LabApp.custom\_css = True  
> to my jupyterhub config, but that changes nothing.

Again, Jupyter **Hub** and Jupyter **Lab** config files are two separate files. If you see `c.JupyterHub` in the file where you added `c.LabApp`, this is the wrong file.

I reall wish JupyterHub included an example for this in the documentation, it feels like this is the most frequent issue that users bump into when trying to configure JupyterLab on JuypterHub.

---

<div class="post-metadata">

**Author:** ![pgosek](https://avatars.discourse-cdn.com/v4/letter/p/47e85d/32.png) [@pgosek](https://discourse.jupyter.org/u/pgosek)\
**Post date:** [July 19, 2024, 10:49am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/6 "2024-07-19T10:49:40Z")

</div>

My bad Michał.  
I have added “c.LabApp.custom\_css = True” to new file passed as config file when starting “jupyterhub-singleuser”. But that still does not change icon color.

---

<div class="post-metadata">

**Author:** ![Danny\_Han](https://yyz1.discourse-cdn.com/flex031/user_avatar/discourse.jupyter.org/danny_han/32/14455_2.png) [@Danny\_Han](https://discourse.jupyter.org/u/Danny_Han)\
**Post date:** [August 16, 2024, 9:38pm UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/7 "2024-08-16T21:38:57Z")

</div>

I was able to enable custom css by adding ~/.jupyter/custom/custom.css & ~/.jupyter/jupyter\_lab\_config.py. Make sure you add c.LabApp.custom\_css = True in the config file.

---

<div class="post-metadata">

**Author:** ![wangzbo](https://yyz1.discourse-cdn.com/flex031/user_avatar/discourse.jupyter.org/wangzbo/32/14831_2.png) [@wangzbo](https://discourse.jupyter.org/u/wangzbo)\
**Post date:** [September 11, 2024, 9:26am UTC](https://discourse.jupyter.org/t/custom-css-for-jupyterhub-singleuser/27036/8 "2024-09-11T09:26:17Z")

</div>

I am having the same issue when trying to disable a menu item under File menu in jupyterhub. I put the css file under /home/jovyan/.jupyter/custom, but unfortunately there is no --custom-css to use for jupyterhub. I also tried to use the spawner args: --ServerApp.extra\_static\_paths=[“/home/jovyan/.jupyter/custom”]’ but no good luck. Is there any alternative to disable a menu item for jupyterhub? Thanks.