개발하자

주피터 노트북의 테마를 변경하시겠습니까?

Cuire 2023. 9. 21. 05:05
반응형

주피터 노트북의 테마를 변경하시겠습니까?

저는 어두운 테마를 좋아해요. 하지만 주피터 노트북의 기본 테마는 가볍고, 테마/배경-색을 변경할 수 있는 옵션을 찾을 수 없습니다. 어떻게 하는 거죠?



다음 단계를 따릅니다

파이프와 함께 설치:

pip install jupyterthemes

그런 다음, 다음 중에서 테마를 선택하고 다음 명령을 사용하여 설정합니다. 설치가 성공적으로 완료되면 대부분의 사람들이 주피터 서버를 다시 시작해야 한다고 생각했습니다. 페이지를 새로 고치기만 하면 됩니다.

다음 명령으로 테마를 설정합니다:

jt -t <theme-name>

사용 가능한 테마:

  • 일개의 일개
  • 3학년
  • 오션스16
  • 체스터적인
  • 모노카이
  • 태양열화한
  • 태양열이 있는

사용 가능한 테마의 스크린샷이 그 안에 있습니다.

테마를 설정할 때는 도구 모음이 표시되지 않는 도구 모음을 유지하려면 선택적으로 동일한 명령에 ()를 지정합니다. 도움말을 보려면 입력합니다.



이 작업은 열린 노트북에서 직접 수행할 수 있습니다:

!pip install jupyterthemes
!jt -t chesterish

테마의 응용 프로그램을 위해 주피터 서버 다시 시작합니다



conda install jupyterthemes

윈도우에서는 나한테 안 통했다. 아나콘다를 쓰고 있어요.

그렇지만,

pip install jupyterthemes

아나콘다 프롬프트에서 일했어요.



내가 주제를 바꾸고 나서 이상하게 행동했다. 글자 크기가 작아서 툴바가 보이지도 않고 새로운 모습이 마음에 들지 않았습니다.

원래 테마를 복원하려는 사람은 다음과 같이 할 수 있습니다:

jt -r

처음에 주피터를 다시 시작해야 하고 나중에 새로 고침하면 새 테마를 사용할 수 있습니다.

또는 공책 내부에서 직접

!jt -r


다음 단계를 수행할 수 있습니다.

  1. 또는 최신 버전의 테마로 업그레이드할 수 있습니다.
  2. 그 후에 당신이 가지고 있는 모든 테마를 나열해 보세요:
  3. 예를 들면 그 이후에


주피터 테마 패키지를 콘다와 함께 직접 설치하려면 다음을 사용합니다:

conda install -c conda-forge jupyterthemes

그러면 다른 분들이 지적하신 것처럼 주제를 바꿔보세요



주피터 글꼴 크기와 내부 및 외부 배경 색상의 단순한 글로벌 변경(이 변경은 모든 노트북에 영향을 미칩니다).

Windows에서 다음 명령을 실행하여 config 디렉토리를 찾습니다:

리눅스에서는 그렇다

이 디렉토리에서 하위 폴더 만들기 파일 및 붙여넣기:

/* 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;
}

마지막으로 주피터를 다시 시작합니다. 결과:

darker backgrounds



주피터 내부에 라이브러리를 설치하는 대신 크롬에서 '다크 리더'를 사용하는 것을 추천한다(예: 파이어폭스와 같은 다른 브라우저에서 '다크 리더' 확장을 찾을 수 있다). 다크 테마를 가질 URL을 필터링하거나 다크 테마를 정의하는 방법까지 사용하여 재생할 수 있습니다. 다음은 몇 가지 예입니다:

enter image description here

enter image description here

도움이 됐으면 좋겠네요.



테마가 활성화된 도커에서 아나콘다를 실행하고 싶은 사람이 있는 경우

docker run -t --rm -p 8888:8888 -v $(pwd):/opt/notebooks continuumio/anaconda3 /bin/bash -c "pip install jupyterthemes; jt -t onedork; /opt/conda/bin/jupyter notebook --ip=0.0.0.0 --port=8888 --notebook-dir=/opt/notebooks --allow-root --no-browser;"


실행 중인 노트북에서 set_nb_theme를 사용하여 테마를 변경할 수 있습니다

!pip install jupyterthemes

from jupyterthemes import get_themes
import jupyterthemes as jt
from jupyterthemes.stylefx import set_nb_theme

set_nb_theme('chesterish')

붙여넣기



FireFox 플러그인 "을(를) 사용합니다.



!pip install jupyterthemes

라이브러리 실행:

from jupyterthemes import get_themes
import jupyterthemes as jt
from jupyterthemes.stylefx import set_nb_theme

그리고 이것:

set_nb_theme('monokai')

테마:

'monokai', 'chesterish', 'oceans16', 'solarizedl', 'solarizeddl', '3등급', 'onedork'



앞서 언급한 바와 같이 보다 널리 사용되는 설치가 가능합니다. 하지만 사용하기 쉽고 의 기본 모양에 영향을 미치지 않는 것을 선호하고 추천할 수도 있습니다.

설치:

문서 및 예제가 포함된 저장소(*지금은 병합되지 않은 pull-request에 예제가 저장됨):

내가 가장 좋아하는 커스터마이징: .



Google chrome을 사용하는 경우 몇 시간 동안 주피터/웹 페이지에서 작업하는 것을 훨씬 쉽게 만들고 코드 내에서 색상 체계를 읽을 수 있게 해주는 어두운 테마를 원한다면, 실험 내에서 "웹 컨텐츠 자동 다크 모드" 플래그를 사용하는 것도 좋습니다. - chrome:/flags - 저는 보통 "선택적 이미지 반전으로 활성화"를 선택합니다" 옵션을 선택합니다.



PIP를 사용하는 동안 오류가 발생한 경우 CMD를 사용하여 명령을 실행할 수 있습니다.



This is easy to do using the jupyter-themes package by Kyle Dunovan. You may be able to install it using conda. Otherwise, you will need to use pip.

Install it with conda:

conda install -c conda-forge jupyterthemes

or pip:

pip install jupyterthemes

You can get the list of available themes with:

jt -l

So change your theme with:

jt -t theme-name

To load a theme, finally, reload the page. The docs and source code are here. When setting a theme, optionally also specify -T (--toolbar) in the same command to also retain the toolbar, without which the toolbar is not shown. For help, type jt -h.



My complete solution:

  1. Get Dark Reader on chrome which will not only get you a great Dark Theme for Jupyter but also for every single website you'd like (you can play with the different filters. I use Dynamic).

  2. Paste those lines of code in your notebook so the legends and axes become visible:

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

You're all set for a disco coding night !



For Dark Mode Only: -

I have used Raleway Font for styling

To C:\User\UserName\.jupyter\custom\custom.css file

append the given styles, this is specifically for Dark Mode for jupyter notebook...

This should be your current custom.css file: -

/* 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;
}

Content to be append starts now

.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;
}

Dark Mode for Jupyter Notebook

Dark Mode for Jupyter Notebook


반응형