Skip to content

Instantly share code, notes, and snippets.

@DanielKotik
Last active April 30, 2025 17:12
Show Gist options
  • Save DanielKotik/4b81480c479a57e0dd13ac4d153e4451 to your computer and use it in GitHub Desktop.
Save DanielKotik/4b81480c479a57e0dd13ac4d153e4451 to your computer and use it in GitHub Desktop.
Colored note boxes inside Jupyter notebooks

############# Markdown parser in Jupyter notebooks ##################

<div class="alert alert-block alert-info"> <b>NOTE</b> Use blue boxes for Tips and notes. </div>

<div class="alert alert-block alert-success"> Use green boxes sparingly, and only for some specific purpose that the other boxes can't cover. For example, if you have a lot of related content to link to, maybe you decide to use green boxes for related links from each section of a notebook. </div>

<div class="alert alert-block alert-warning"> Use yellow boxes for examples that are not inside code cells, or use for mathematical formulas if needed. </div>

<div class="alert alert-block alert-danger"> In general, just avoid the red boxes. </div>

############# Markdown parser in Sphinx ##################

<div class="admonition note"> <p class="admonition-title">Note</p> <p>You should note that the title will be automatically capitalized.</p> </div>

<div class="admonition danger"> <p class="admonition-title">Don't try this at home</p> <p>...</p> </div>

<div class="admonition important"> <p>This is an admonition box without a title.</p> </div>

@auggie246
Copy link

Anyway to make this visible in dark mode too?

NOTE Use blue boxes for Tips and notes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment