One way is to create a cell with the css

As soon as clicked the CSS is activate
if you choose this it may be placed in the very bottom of the notebook and out of the way

In [ ]:
from IPython.core.display import HTML
HTML("""
<style>
#notebook-container {
    padding: 15px;
    background-color: #E3F6FF;
    min-height: 0;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
}
.notebook_app {
    background-color: lightblue;
}
#header{
background-color: #ffebcd;
}
#notebook_name.filename{
color:DarkRed;
font-size:200%;
}
body #header{
background-color:#F9E1DF;
}
</style>
""")

------------------------------------------------------------------

Another Way to Create Custom Jupyter Notebook Colors Scheme

Create a file with your css. Call it anything

In [61]:
%%writefile blues.txt
<style>
#notebook-container {
    padding: 15px;
    background-color: #E3F6FF;
    min-height: 0;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
}
.notebook_app {
    background-color: lightblue;
}
#header{
background-color: #ffebcd;
}
#notebook_name.filename{
color:DarkRed;
font-size:200%;
}
body #header{
background-color:#F9E1DF;
}
</style>
Overwriting blues.txt
In [59]:
%%writefile beige.txt
<style>
#notebook-container {
    padding: 15px;
    background-color: #ffebcd;
    min-height: 0;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
}
.notebook_app {
    background-color: #f5f5dc;
}
body #header{
background-color:#F9E1DF;
}
</style>
Writing beige.txt

Open and read() the file you created for your color scheme

place the object inside of the HTML parentheses

In [44]:
from IPython.core.display import HTML
htm = open("blues.txt").read()
HTML(htm)
Out[44]:

The third and more permanant way Change the custom/custom.css

Changing the custom.css must be experimental, because all computers are not set up the same. In my case /usr/local/lib/python2.7/dist-packages/notebook/static/custom/custom.css was the correct location. A good way to find the correct custom.css is to look at the page source in your browser. The LAST css link in the head, is the correct file to change.
In [ ]:
the head looks like:
<link rel="stylesheet" href="/static/components/bootstrap-tour/build/css/bootstrap-tour.min.css?v=d0b3c2fce6056a2ddd5a4513762a94c4" type="text/css" />
<link rel="stylesheet" href="/static/components/codemirror/lib/codemirror.css?v=ae81317fa2b3a745892c83985827d41b">
<link rel="stylesheet" href="/static/style/style.min.css?v=47782e517c98a53adb514cbefb4528f2" type="text/css"/>
<link rel="stylesheet" href="/static/notebook/css/override.css?v=e6f18013b8771987812e992b38ec3318" type="text/css" />
<link rel="stylesheet" href=""  id='kernel-css' type="text/css" />
<link rel="stylesheet" href="/static/custom/custom.css" type="text/css" />

LAST ENTRY :
    
    <link rel="stylesheet" href="/static/custom/custom.css" type="text/css" />
In [71]:
!locate custom/custom.css
/usr/local/lib/python2.7/dist-packages/jupyter_core/tests/dotipython/profile_default/static/custom/custom.css
/usr/local/lib/python2.7/dist-packages/jupyter_core/tests/dotipython/profile_default/static/custom/custom.cssbk
/usr/local/lib/python2.7/dist-packages/jupyter_core/tests/dotipython_empty/profile_default/static/custom/custom.css
/usr/local/lib/python2.7/dist-packages/jupyter_core/tests/dotipython_empty/profile_default/static/custom/custom.cssbk
/usr/local/lib/python2.7/dist-packages/notebook/static/custom/custom.css
In [ ]:
The last one listed was in the /static/custom/custom.css directory the whole path being:<br /> 
/usr/local/lib/python2.7/dist-packages/notebook/static/custom/custom.css

I loaded the original then added my own css.

In [62]:
%%writefile custom.css
/*
Placeholder for custom user CSS

mainly to be overridden in profile/static/custom/custom.css

This will always be an empty file in IPython
*/

/*for the error , connecting & renaming window*/

[dir="rtl"] .modal-footer {
	text-align : left !important;
}

[dir="rtl"] .close {
	float : left;
}

[dir="rtl"] .fa-step-forward::before {
    content: "\f048";
}
span.save_widget span.filename {
    height: 100%;
    color:DarkRed;
    line-height: 1em;
    margin-left: 16px;
    border: none;
    font-size: 146.5%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    border-radius: 2px;
}
#notebook-container {
    padding: 15px;
    background-color: #E3F6FF;
    min-height: 0;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.3);
}
.notebook_app {
    background-color: lightblue;
}
#notebook_name.filename{
color:DarkRed;
font-size:200%;
}
body #header{
background-color:#F9E1DF;
}
Overwriting custom.css

Copying the custom.css to ' /usr/local/lib/python2.7/dist-packages/notebook/static/custom/ ' requires using sudo

Easy way to use sudo with password in Jupyter Notebook

Create a password file

In [66]:
%%writefile PassWord.py
# Create a password file
def getpass():
    Pass_key = 'mypassword'
    Getpass = (Pass_key)
    return Getpass
Overwriting PassWord.py

Import the PassWord file and use password

In [67]:
import PassWord
password = PassWord.getpass()
password
Out[67]:
'mypassword'

---------------------------------------------------

Copy custom.css to the correct directory

In [63]:
from scripts import passWord
import os
password = passWord.getpass()
os.system('echo '+password+' | sudo -S cp custom.css /usr/local/lib/python2.7/dist-packages/notebook/static/custom/')
Out[63]:
0
In [70]:
from scripts import passWord
import os
password = passWord.getpass()
os.system('echo '+password+' | sudo -S updatedb')
Out[70]:
0

The code below will create an HTML page

The page has a slider as a color picker for your color picking pleasure.

In [81]:
from PIL import Image
img = Image.open("clipboard.png")
img
Out[81]:

Use the Notebook Home page to open it

In [23]:
%%writefile colors.html
<!DOCTYPE html>
<html>
    <head>
    <script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
        <style>
        .sliders {
    display: inline-block;
    zoom: 1; *display: inline;
    width: 210px;
    vertical-align: middle;
    overflow: hidden;
}
.color {
    display: inline-block;
    zoom:1; *display: inline;
    width: 100px;
    height: 100px;
    border: 1px solid rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.3);
    margin: 0 20px;
    vertical-align: middle;
}
.output {
    display: inline-block;
    zoom: 1; *display: inline;
    vertical-align: middle;
    overflow: hidden;
}
.sliders dt,
.output dt {
    float: left;
    clear: left;
    width: 50px;
    height: 40px;
    line-height: 40px;
}
.sliders dd,
.output dd {
    float: left;
    height: 40px;
    line-height: 40px;
    margin: 0;
}

        </style>
    </head>
    <body>
        <div class="sliders yui3-skin-sam">
    <dl>
        <dt>R: <span id="r-val" class="val"></span></dt><dd id="r-slider"></dd>
        <dt>G: <span id="g-val" class="val"></span></dt><dd id="g-slider"></dd>
        <dt>B: <span id="b-val" class="val"></span></dt><dd id="b-slider"></dd>
    </dl>
</div>
<div class="color"></div>
<div class="output">
    <dl>
        <dt>Hex:</dt><dd id="hex"></dd>
        <dt>RGB:</dt><dd id="rgb"></dd>
        <dt>HSL:</dt><dd id="hsl"></dd>
    </dl>
</div>

        <script>
            YUI().use('slider', 'color', function(Y){
                // sliders
    var rSlider = new Y.Slider({ min: 0, max: 255, value: Math.round(Math.random()*255) }),
        gSlider = new Y.Slider({ min: 0, max: 255, value: Math.round(Math.random()*255) }),
        bSlider = new Y.Slider({ min: 0, max: 255, value: Math.round(Math.random()*255) }),

        // slider values
        rVal = Y.one('#r-val'),
        gVal = Y.one('#g-val'),
        bVal = Y.one('#b-val'),

        // color strings
        hex = Y.one('#hex'),
        rgb = Y.one('#rgb'),
        hsl = Y.one('#hsl'),

        // color chip
        color = Y.one('.color');

    // render sliders
    rSlider.render('#r-slider');
    gSlider.render('#g-slider');
    bSlider.render('#b-slider');


                // register update events
    rSlider.after('thumbMove', function(e) {
        rVal.set('text', rSlider.get('value'));
        updateColors();
    });
    gSlider.after('thumbMove', function(e) {
        gVal.set('text', gSlider.get('value'));
        updateColors();
    });
    bSlider.after('thumbMove', function(e) {
        bVal.set('text', bSlider.get('value'));
        updateColors();
    });

    // update the colors strings
    function updateColors() {
        var r = rSlider.get('value'),
            g = gSlider.get('value'),
            b = bSlider.get('value'),
            rgbStr = Y.Color.fromArray([r,g,b], Y.Color.TYPES.RGB);

        color.setStyle('backgroundColor', rgbStr);

        rgb.set('text', rgbStr);

        hex.set('text', Y.Color.toHex(rgbStr));
        hsl.set('text', Y.Color.toHSL(rgbStr));
    }


            
    rVal.set('text', rSlider.get('value'));
    gVal.set('text', gSlider.get('value'));
    bVal.set('text', bSlider.get('value'));
    updateColors();

            });
        </script>
    </body>
</html>
Writing colors.html
In [84]:
!ipython nbconvert CUSTOM-CSS.ipynb CUSTOM-CSS.html
[TerminalIPythonApp] WARNING | Subcommand `ipython nbconvert` is deprecated and will be removed in future versions.
[TerminalIPythonApp] WARNING | You likely want to use `jupyter nbconvert` in the future
[NbConvertApp] Converting notebook CUSTOM-CSS.ipynb to html
[NbConvertApp] Writing 314034 bytes to CUSTOM-CSS.html
[NbConvertApp] Converting notebook CUSTOM-CSS.html to html
Traceback (most recent call last):
  File "/usr/local/bin/ipython", line 11, in <module>
    sys.exit(start_ipython())
  File "/usr/local/lib/python2.7/dist-packages/IPython/__init__.py", line 119, in start_ipython
    return launch_new_instance(argv=argv, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/traitlets/config/application.py", line 658, in launch_instance
    app.start()
  File "/usr/local/lib/python2.7/dist-packages/IPython/terminal/ipapp.py", line 351, in start
    return self.subapp.start()
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/nbconvertapp.py", line 325, in start
    self.convert_notebooks()
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/nbconvertapp.py", line 493, in convert_notebooks
    self.convert_single_notebook(notebook_filename)
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/nbconvertapp.py", line 464, in convert_single_notebook
    output, resources = self.export_single_notebook(notebook_filename, resources, input_buffer=input_buffer)
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/nbconvertapp.py", line 393, in export_single_notebook
    output, resources = self.exporter.from_filename(notebook_filename, resources=resources)
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/exporters/exporter.py", line 174, in from_filename
    return self.from_file(f, resources=resources, **kw)
  File "/usr/local/lib/python2.7/dist-packages/nbconvert/exporters/exporter.py", line 192, in from_file
    return self.from_notebook_node(nbformat.read(file_stream, as_version=4), resources=resources, **kw)
  File "/usr/local/lib/python2.7/dist-packages/nbformat/__init__.py", line 141, in read
    return reads(fp.read(), as_version, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/nbformat/__init__.py", line 74, in reads
    nb = reader.reads(s, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/nbformat/reader.py", line 58, in reads
    nb_dict = parse_json(s, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/nbformat/reader.py", line 17, in parse_json
    raise NotJSONError(("Notebook does not appear to be JSON: %r" % s)[:77] + "...")
NotJSONError: Notebook does not appear to be JSON: u'<!DOCTYPE html>\n<html>\n<head><meta c...

If you suspect this is an IPython bug, please report it at:
    https://github.com/ipython/ipython/issues
or send an email to the mailing list at ipython-dev@python.org

You can print a more detailed traceback right now with "%tb", or use "%debug"
to interactively debug it.

Extra-detailed tracebacks for bug-reporting purposes can be enabled via:
    c.Application.verbose_crash=True

In [63]:
from scripts import passWord
import os
password = passWord.getpass()
os.system('echo '+password+' | sudo -S cp custom.css /usr/local/lib/python2.7/dist-packages/notebook/static/custom/')
Out[63]:
0
In [ ]:
!rm CUSTOM-CSS.html