Поменять тему в блокноте Jupyter?


206

Мне нравятся темные темы. Тем не менее, тема по умолчанию для ноутбуков Jupyter светлая, и я не могу найти вариант, чтобы изменить тему / цвет фона. Как это сделать?


3
используя Конда: anaconda.org/conda-forge/jupyterthemes
Bigby

Ответы:


288

Это легко сделать с помощью jupyter-themesпакета Кайла Дунована. Вы можете установить его, используя conda. В противном случае вам нужно будет использовать pip.

Установите его с помощью conda:

conda install jupyterthemes

или пункт

pip install jupyterthemes

Затем измените свою тему с

jt -t chesterish

Чтобы загрузить тему Chesterish или любой другой. Наконец, перезагрузите страницу. Документы и исходный код находятся здесь: https://github.com/dunovank/jupyter-themes


29
Примечание. Мне пришлось перезапустить сервер Jupyter, чтобы это работало.
Амир Ф

9
В первый раз, возможно, потребуется перезагрузить, jupyter notebookчтобы это работало, но в следующий раз просто переключитесь jt -t <themes>на терминал и перезагрузите страницы записной книжки. Это ведет себя примерно так со мной.
iNet

10
jupyterthemesне на conda и не на conda-forge, единственный способ установить его - pipтолько через
Мохаммад Хиззани

13
Мне удалось с conda после добавления канала conda-forge conda config --add channels conda-forge
Ernest

11
Если jupyterthemesответ находится на conda-forge, в ответе должно быть указано, что conda install jupyterthemes -c conda-forgeэто необходимо, или отказаться от того, чтобы рекомендовать установку с conda.
Mmagnuski

92

Следуй этим шагам:-

pip установить темы.

pip install jupyterthemes

Затем выберите темы из следующих и установите их с помощью следующей команды: Как только вы успешно установили, многие из нас подумали, что нам нужно снова запустить сервер jupyter, просто обновите страницу. Установить тему

jt -t <theme-name>

Список названий тем

  • onedork
  • класс 3
  • oceans16
  • chesterish
  • monokai
  • solarizedl
  • solarizedd

1
перечислил две вещи: 1. дискриминация запуска сервера jupyter. 2. Тема союзов / имя
Сахил Нагпал

7
Это на самом деле не гарантирует новый ответ. Просто незначительное редактирование существующего.
Жан-Франсуа Корбетт

5
Там также расширение хром для этого . Это в основном делает то же самое, но без терминального взаимодействия.
iNet

2
как называется классическая тема? Если я хочу вернуться и вернуться к оригинальной классической?
ZelelB

3
Для полноты, кроме перечисленных тем, эти 2 также доступны: gruvboxd, gruvboxl по состоянию на январь 2019 года
поисковик

51

После того, как я сменил тему, он вел себя странно. Размер шрифта был маленьким, я не вижу панель инструментов, и мне действительно не понравился новый внешний вид.

Для тех, кто хочет восстановить оригинальную тему, вы можете сделать это следующим образом:

jt -r

Вам нужно перезапустить Jupyter при первом запуске, и позднее обновления достаточно, чтобы включить новую тему.

или прямо из ноутбука

!jt -r

4
Престижность за то, как восстановить оригинальную тему
Брифорд Уайли

28

Вы можете сделать это прямо из открытой записной книжки:

!pip install jupyterthemes
!jt -t chesterish

Вам не нужно перезапускать сервер Jupyter, чтобы это вступило в силу?
Древицко

Правда, вам нужно будет перезапустить ядро, если я правильно помню
Амир Ф

20

Вместо установки библиотеки внутри Jupyter, я бы порекомендовал вам использовать расширение «Темный читатель» - https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh в Chrome (вы можете найти расширение «Темный читатель» в других браузерах, например Firefox). Вы можете играть с ним; отфильтруйте URL-адреса, которые вы хотите создать темную тему, или даже определите темную тему для себя. Ниже приведено несколько примеров:

введите описание изображения здесь

введите описание изображения здесь

Я надеюсь, что это помогает. Behrouz


Я думаю, что это лучший подход, потому что нам обычно нужна темная тема, которую она обеспечивает, и, кроме того, легко проверить реальный внешний вид документа, который мы создаем, только одним щелчком мыши. (важно во время публикации)
М. Доости Лахани

Да ... это все хорошо, но Темный Читатель не знает, что блокнот Юпитера должен раскрашивать слова. Нет синтаксической раскраски, что делает эту опцию нет-нет.
дорогая

@darlove, насколько я работал с ним, там есть «раскраска синтаксиса» (например, синтаксис «для цикла» имеет одинаковый цвет во всем вашем коде.
Behrouz Beheshti

Я не знаю как вы, но Темный Читатель очень хорошо выделяет мой синтаксис. Кроме того, это расширение спасает жизнь ... наконец-то, что может даже сделать Stack Overflow темным!
Натали

1
Хотя есть одна проблема. Если вы попытаетесь выбрать несколько символов с помощью мыши, выделение не будет видно на черном фоне.
Каушальпранав

7

Чтобы установить пакет Jupyterthemes напрямую с помощью conda, используйте:

conda install -c conda-forge jupyterthemes

Затем, как уже отмечали другие, измените тему с jt -t <theme-name>


6

Простое глобальное изменение размера шрифта Jupyter и внутренних и внешних цветов фона (это изменение затронет все ноутбуки).

В Windows найдите каталог конфигурации, выполнив команду: jupyter --config-dir

В Linux это ~/.jupyter

В этом каталоге создайте подпапку custom Create file custom.cssи вставьте:

/* Change outer background and make the notebook take all available width */
.container {
    width: 99% !important;
    background: #DDC !important;
}   

/* Change inner background (CODE) */
div.input_area {
    background: #F4F4E2 !important;
    font-size: 16px !important;
}

/* Change global font size (CODE) */
.CodeMirror {
    font-size: 16px !important;
}  

/* Prevent the edit cell highlight box from getting clipped;
 * important so that it also works when cell is in edit mode */
div.cell.selected {
    border-left-width: 1px !important;
} 

Наконец - перезагрузите Jupyter. Результат:

темные фоны


Пожалуйста, как отменить это?
Амину Кано

1
Удалите файл, который вы создали (custom.css) и перезапустите Jupyter.
Рафал Хлопек

Это работает, но я должен очистить кеш браузера, хотя.
Амину Кано

5

Вы можете следовать этим шагам.

  1. pip install jupyterthemesили pip install --upgrade jupyterthemesдля обновления до последней версии темы.
  2. После этого перечислите все темы, которые у вас есть:jt -l
  3. после этого jt-t <themename>напримерjt -t solarizedl

4
conda install jupyterthemes

у меня не работало в винде. Я использую Анаконду.

Но,

pip install jupyterthemes

работал в Anaconda Prompt.


7
Вам нужно указать правильную коллекцию для conda:conda install -c conda-forge jupyterthemes
Филипп Роланд Ярнхус

2

Мое полное решение:

1) Установите Dark Reader на Chrome, который даст вам не только отличную темную тему для Jupyter, но и для каждого отдельного веб-сайта, который вам нужен (вы можете играть с различными фильтрами. Я использую Dynamic).

2) Вставьте эти строки кода в свой блокнот, чтобы легенды и оси стали видны:

from jupyterthemes import jtplot
jtplot.style(theme='monokai', context='notebook', ticks=True, grid=False)

Вы готовы к вечеринке в стиле диско!


1

Только для темного режима: -

Я использовал Raleway Font для стиля

В файл C: \ User \ UserName \ .jupyter \ custom \ custom.css

добавить данные стили, это специально для Dark Mode для ноутбука Jupyter ...

Это должен быть ваш текущий файл custom.css: -

/* This file contains any manual css for this page that needs to override the global styles.
    This is only required when different pages style the same element differently. This is just
    a hack to deal with our current css styles and no new styling should be added in this file.*/

#ipython-main-app {
    position: relative;
}

#jupyter-main-app {
    position: relative;
}

Содержимое для добавления начинается сейчас

.header-bar {
    display: none;
}

#header-container img {
    display: none;
}

#notebook_name {
    margin-left: 0px !important;
}

#header-container {
    padding-left: 0px !important
}

html,
body {
    overflow: hidden;
    font-family: OpenSans;
}

#header {
    background-color: #212121 !important;
    color: #fff;
    padding-top: 20px;
    padding-bottom: 50px;
}

.navbar-collapse {
    background-color: #212121 !important;
    color: #fff;
    border: none !important
}

#menus {
    border: none !important;
    color: white !important;
}

#menus .dropdown-toggle {
    color: white !important;
}

#filelink {
    color: white !important;
    text-align: centerimportant;
    padding-left: 7px;
    text-decoration: none !important;
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    background-color: #191919 !important;
    color: #eee !important;
    text-align: left !important;
}

.dropdown-menu,
.dropdown-menu a,
.dropdown-submenu a {
    background-color: #191919;
    color: #fff !important;
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus,
.dropdown-submenu>a:after {
    background-color: #212121;
    color: #fff !important;
}

.btn-default {
    color: #fff !important;
    background-color: #212121 !important;
    border: none !important;
}

.dropdown {
    text-align: left !important;
}

.form-control.select-xs {
    background-color: #191919 !important;
    color: #eee !important;
    border: none;
    outline: none;
}

#modal_indicator {
    display: none;
}

#kernel_indicator {
    color: #fff;
}

#notification_trusted,
#notification_notebook {
    background-color: #212121;
    color: #eee !important;
    border: none;
    border-bottom: 1px solid #eee;
}

#logout {
    background-color: #191919;
    color: #eee;
}

#maintoolbar-container {
    padding-top: 0px !important;
}

.notebook_app {
    background-color: #222222;
}

::-webkit-scrollbar {
    display: none;
}

#notebook-container {
    background-color: #212121;
}

div.cell.selected,
div.cell.selected.jupyter-soft-selected {
    border: none !important;
}

.cm-keyword {
    color: orange !important;
}

.input_area {
    background-color: #212121 !important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.cm-def {
    color: #5bc0de !important;
}

.cm-variable {
    color: yellow !important;
}

.output_subarea.output_text.output_result pre,
.output_subarea.output_text.output_stream.output_stdout pre {
    color: white !important;
}

.CodeMirror-line {
    color: white !important;
}

.cm-operator {
    color: white !important;
}

.cm-number {
    color: lightblue !important;
}

.inner_cell {
    border: 1px thin #eee;
    border-radius: 50px !important;
}

.CodeMirror-lines {
    border-radius: 20px;
}

.prompt.input_prompt {
    color: #5cb85c !important;
}

.prompt.output_prompt {
    color: lightblue;
}

.cm-string {
    color: #6872ac !important;
}

.cm-builtin {
    color: #f0ad4e !important;
}

.run_this_cell {
    color: lightblue !important;
}

.input_area {
    border-radius: 20px;
}

.output_png {
    background-color: white;
}

.CodeMirror-cursor {
    border-left: 1.4px solid white;
}

.box-flex1.output_subarea.raw_input_container {
    color: white;
}

input.raw_input {
    color: black !important;
}

div.output_area pre {
    color: white
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: white !important;
    font-weight: bolder !important;
}

.CodeMirror-gutter.CodeMirror-linenumber,
.CodeMirror-gutters {
    background-color: #212121 !important;
}


span.filename:hover {
    color: #191919 !important;
    height: auto !important;
}

#site {
    background-color: #191919 !important;
    color: white !important;
}

#tabs li.active a {
    background-color: #212121 !important;
    color: white !important;
}

#tabs li {
    background-color: #191919 !important;
    color: white !important;
    border-top: 1px thin #eee;
}

#notebook_list_header {
    background-color: #212121 !important;
    color: white !important;
}

#running .panel-group .panel {
    background-color: #212121 !important;
    color: white !important;
}

#accordion.panel-heading {
    background-color: #212121 !important;
}

#running .panel-group .panel .panel-heading {
    background-color: #212121;
    color: white
}

.item_name {
    color: white !important;
    cursor: pointer !important;
}

.list_item:hover {
    background-color: #212121 !important;
}

.item_icon.icon-fixed-width {
    color: white !important;
}

#texteditor-backdrop {
    background-color: #191919 !important;
    border-top: 1px solid #eee;
}

.CodeMirror {
    background-color: #212121 !important;
}

#texteditor-backdrop #texteditor-container .CodeMirror-gutter,
#texteditor-backdrop #texteditor-container .CodeMirror-gutters {
    background-color: #212121 !important;
}

.celltoolbar {
    background-color: #212121 !important;
    border: none !important;
}

Темный режим для ноутбука Jupyter

Темный режим для ноутбука Jupyter

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.