Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Hello, @Cyrille! I am not completely sure that I understood what you intend to do, but I hope this solves your problem. I am using the configurations you wrote in your comment.

First, put the following in a Jupyter cell:

%%html
<style>
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>

The first line indicates that this cell will execute html code. Then, the second line is the code from your comment, but you should have the Palatino Linotype fonts installed on your computer. This should change all the fonts.

Many parts of the Jupyter notebook have different styles, which will overwrite your font settings. For example, the code html tag uses monospace fonts; that is why you should change some tags and classes settings also. (I suspect you are using this complicated style because you inspected the tags and classes of the Jupyter notebook. As far as I can see, these are all the configurations you will require; but if you were to need to change the font for something else, I assume you will be able to discover the corresponding tag or class.) Another important comment is that you could the body tag with *---personally, I can't see the difference, but it is my understanding that* is more general.

After this, you can write something like

%%latex
The formula
$$\int_a^b\sin(x)\;dx=-\cos(x)+C$$
is completely correct.

as your second cell, and you will notice that the font is consistent. (This should solve the problem with MathJax you mentioned in your comment.) Since the Jupyter notebooks are html, you can inspect the code with the developer tools of your web browser (for example, pressing <f12> in Firefox) to verify that the correct font has been used.

Sage code cells do not require any special magic comments; just write what you need to execute:

integrate(x^2, x)

That being said, if you share your Jupyter notebook with somebody that doesn't have the fonts you used intalled on their system, the web browser will use some default font. You can prevent this from happening by using a web font service like Google Fonts. For instance, here I am importing a font and using it for the complete notebook:

%%html <style> @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap'); body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); } .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; } .input-prompt { color: rgb(108, 119, 188); } .output-prompt { color: rgb(20, 129, 106); } code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; } </style>

You can also download the fonts you require, put the in a folder called, for example, "fonts" and share it together with your notebook. In that case, you should write something like

%%html
<style>
    @font-face { font-family: "RobotoSlab"; src: url("fonts/RobotoSlab-VariableFont_wght.ttf"); }
    body { font-family: "RobotoSlab", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    input-prompt { color: rgb(108, 119, 188); }
    output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; }
</style>

I hope this helps!

Hello, @Cyrille! I am not completely sure that I understood what you intend to do, but I hope this solves your problem. I am using the configurations you wrote in your comment.

First, put the following in a Jupyter cell:

%%html
<style>
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>

The first line indicates that this cell will execute html code. Then, the second line is the code from your comment, but you should have the Palatino Linotype fonts installed on your computer. This should change all the fonts.

Many parts of the Jupyter notebook have different styles, which will overwrite your font settings. For example, the code html tag uses monospace fonts; that is why you should change some tags and classes settings also. (I suspect you are using this complicated style because you inspected the tags and classes of the Jupyter notebook. As far as I can see, these are all the configurations you will require; but if you were to need to change the font for something else, I assume you will be able to discover the corresponding tag or class.) Another important comment is that you could the body tag with *---personally, I can't see the difference, but it is my understanding that* is more general.

After this, you can write something like

%%latex
The formula
$$\int_a^b\sin(x)\;dx=-\cos(x)+C$$
is completely correct.

as your second cell, and you will notice that the font is consistent. (This should solve the problem with MathJax you mentioned in your comment.) Since the Jupyter notebooks are html, you can inspect the code with the developer tools of your web browser (for example, pressing <f12> in Firefox) to verify that the correct font has been used.

Sage code cells do not require any special magic comments; just write what you need to execute:

integrate(x^2, x)

That being said, if you share your Jupyter notebook with somebody that doesn't have the fonts you used intalled on their system, the web browser will use some default font. You can prevent this from happening by using a web font service like Google Fonts. For instance, here I am importing a font and using it for the complete notebook:

%%html
 <style>
     @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
     body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
     .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
     .input-prompt { color: rgb(108, 119, 188); }
     .output-prompt { color: rgb(20, 129, 106); }
     code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
    </style>

</style>

You can also download the fonts you require, put the in a folder called, for example, "fonts" and share it together with your notebook. In that case, you should write something like

%%html
<style>
    @font-face { font-family: "RobotoSlab"; src: url("fonts/RobotoSlab-VariableFont_wght.ttf"); }
    body { font-family: "RobotoSlab", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    input-prompt { color: rgb(108, 119, 188); }
    output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; }
</style>

I should point out that not all the fonts obey the cursive setting. However, remember that normal text should be written in roman font, while math should be written in cursive. I don't recommend using cursive for the complete notebook.

I hope this helps!

Hello, @Cyrille! I am not completely sure that I understood what you intend to do, but I hope this solves your problem. I am using the configurations you wrote in your comment.

First, put the following in a Jupyter cell:

%%html
<style>
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>

The first line indicates that this cell will execute html code. Then, the second line is the code from your comment, but you should have the Palatino Linotype fonts installed on your computer. This should change all the fonts.

Many parts of the Jupyter notebook have different styles, which will overwrite your font settings. For example, the code html tag uses monospace fonts; that is why you should change some tags and classes settings also. (I suspect you are using this complicated style because you inspected the tags and classes of the Jupyter notebook. As far as I can see, these are all the configurations you will require; but if you were to need to change the font for something else, I assume you will be able to discover the corresponding tag or class.) Another important comment is that you could the body tag with *---personally, I can't see the difference, but it is my understanding that* is more general.

After this, you can write something like

%%latex
The formula
$$\int_a^b\sin(x)\;dx=-\cos(x)+C$$
$$\int_a^b\sin(x)\;dx=-\cos(b)+\cos(a)$$
is completely correct.

as your second cell, and you will notice that the font is consistent. (This should solve the problem with MathJax you mentioned in your comment.) Since the Jupyter notebooks are html, you can inspect the code with the developer tools of your web browser (for example, pressing <f12> in Firefox) to verify that the correct font has been used.

Sage code cells do not require any special magic comments; just write what you need to execute:

integrate(x^2, x)

That being said, if you share your Jupyter notebook with somebody that doesn't have the fonts you used intalled on their system, the web browser will use some default font. You can prevent this from happening by using a web font service like Google Fonts. For instance, here I am importing a font and using it for the complete notebook:

%%html
<style>
    @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>

You can also download the fonts you require, put the in a folder called, for example, "fonts" and share it together with your notebook. In that case, you should write something like

%%html
<style>
    @font-face { font-family: "RobotoSlab"; src: url("fonts/RobotoSlab-VariableFont_wght.ttf"); }
    body { font-family: "RobotoSlab", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    input-prompt { color: rgb(108, 119, 188); }
    output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "RobotoSlab", cursive, sans-serif; font-size: 15px; }
</style>

I should point out that not all the fonts obey the cursive setting. However, remember that normal text should be written in roman font, while math should be written in cursive. I don't recommend using cursive for the complete notebook.

I hope this helps!

Hello, @Cyrille! I am not completely sure that I understood what you intend to do, but I hope this solves your problem. I am using the configurations you wrote in your comment.

First, put the following in a Jupyter cell:

%%html
<style>
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>

The first line indicates that this cell will execute html code. Then, the second line is the code from your comment, but you should have the Palatino Linotype fonts installed on your computer. This should change all the fonts.

Many parts of the Jupyter notebook have different styles, which will overwrite your font settings. For example, the code html tag uses monospace fonts; that is why you should change some tags and classes settings also. (I suspect you are using this complicated style because you inspected the tags and classes of the Jupyter notebook. As far as I can see, these are all the configurations you will require; but if you were to need to change the font for something else, I assume you will be able to discover the corresponding tag or class.) Another important comment is that you could the body tag with *---personally, I can't see the difference, but it is my understanding that* is more general.

After this, you can write something like

%%latex
The formula
$$\int_a^b\sin(x)\;dx=-\cos(b)+\cos(a)$$
is completely correct.

as your second cell, and you will notice that the font is consistent. (This should solve the problem with MathJax you mentioned in your comment.) Since the Jupyter notebooks are html, you can inspect the code with the developer tools of your web browser (for example, pressing <f12> in Firefox) to verify that the correct font has been used.

Sage code cells do not require any special magic comments; just write what you need to execute:

integrate(x^2, x)

That being said, if you share your Jupyter notebook with somebody that doesn't have the fonts you used intalled on their system, the web browser will use some default font. You can prevent this from happening by using a web font service like Google Fonts. For instance, here I am importing a font and using it for the complete notebook:

%%html
<style>
    @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
    body { font-family: "Palatino Linotype", cursive, sans-serif; "Roboto Slab", serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; "Roboto Slab", serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; "Roboto Slab", serif; font-size: 15px; }
</style>

You can also download the fonts you require, put the in a folder called, for example, "fonts" and share it together with your notebook. In that case, you should write something like

%%html
<style>
    @font-face { font-family: "RobotoSlab"; "Roboto Slab"; src: url("fonts/RobotoSlab-VariableFont_wght.ttf"); }
    body { font-family: "RobotoSlab", cursive, sans-serif; "Roboto Slab", serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "RobotoSlab", cursive, sans-serif; "Roboto Slab", serif; font-size: 15px; min-width: 6em; }
    input-prompt { color: rgb(108, 119, 188); }
    output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "RobotoSlab", cursive, sans-serif; "Roboto Slab", serif; font-size: 15px; }
</style>

I should point out that not all the fonts obey the cursive setting. or the sans-serif settings (for example, "Roboto Slab"). However, remember that normal text should be written in roman font, while math should be written in cursive. I don't recommend using cursive for the complete notebook.

I hope this helps!

Hello, @Cyrille! I am not completely sure that I understood what you intend to do, but I hope this solves your problem. I am using the configurations you wrote in your comment.

First, put the following in a Jupyter cell:

%%html
html("""
<style>
    body { font-family: "Palatino Linotype", cursive, sans-serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Palatino Linotype", cursive, sans-serif; font-size: 15px; }
</style>
</style>""")

The first line indicates that this cell will execute html code. Then, the second line is the code from your comment, but you should have the Palatino Linotype fonts installed on your computer. This should change all the fonts.

Many parts of the Jupyter notebook have different styles, which will overwrite your font settings. For example, the code html tag uses monospace fonts; that is why you should change some tags and classes settings also. (I suspect you are using this complicated style because you inspected the tags and classes of the Jupyter notebook. As far as I can see, these are all the configurations you will require; but if you were to need to change the font for something else, I assume you will be able to discover the corresponding tag or class.) Another important comment is that you could the body tag with *---personally, I can't see the difference, but it is my understanding that* is more general.

After this, you can write something like

%%latex
The formula
$$\int_a^b\sin(x)\;dx=-\cos(b)+\cos(a)$$
is completely correct.

as your second cell, and you will notice that the font is consistent. (This should solve the problem with MathJax you mentioned in your comment.) Since the Jupyter notebooks are html, you can inspect the code with the developer tools of your web browser (for example, pressing <f12> in Firefox) to verify that the correct font has been used.

Sage code cells do not require any special magic comments; just write what you need to execute:

integrate(x^2, x)

That being said, if you share your Jupyter notebook with somebody that doesn't have the fonts you used intalled on their system, the web browser will use some default font. You can prevent this from happening by using a web font service like Google Fonts. For instance, here I am importing a font and using it for the complete notebook:

%%html
html("""
<style>
    @import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
    body { font-family: "Roboto Slab", serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Roboto Slab", serif; font-size: 15px; min-width: 6em; }
    .input-prompt { color: rgb(108, 119, 188); }
    .output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Roboto Slab", serif; font-size: 15px; }
</style>
</style>""")

You can also download the fonts you require, put the in a folder called, for example, "fonts" and share it together with your notebook. In that case, you should write something like

%%html
html("""
<style>
    @font-face { font-family: "Roboto Slab"; src: url("fonts/RobotoSlab-VariableFont_wght.ttf"); }
    body { font-family: "Roboto Slab", serif; background-color: rgb(252,251,251); }
    .prompt { font-family: "Roboto Slab", serif; font-size: 15px; min-width: 6em; }
    input-prompt { color: rgb(108, 119, 188); }
    output-prompt { color: rgb(20, 129, 106); }
    code, kbd, pre, samp, .CodeMirror { font-family: "Roboto Slab", serif; font-size: 15px; }
</style>
</style>""")

I should point out that not all the fonts obey the cursive or the sans-serif settings (for example, "Roboto Slab"). However, remember that normal text should be written in roman font, while math should be written in cursive. I don't recommend using cursive for the complete notebook.

If you prefer, instead of using Sage's html function, you can use IPython's HTML function. You should write the following in some cell before using it:

from IPython.display import HTML

I hope this helps!