Published on

# Dash (Plotly) tips - Latex, Google Fonts, and more

Authors

Dash applications need a lot of work to make them look good. Here's a few 'how to' extras that can help out

## Latex in Markdown

The latest release of Dash made it much easier to add Latex to your markdown elements. Here's an example:

dcc.Markdown(children="""
This is Latex:
\\begin{align} y &= x \\\\ &= 0 \\end{align}
""", mathjax=True)


Which gives us:

There were only two tricky bits now: you must set the mathjax=True in order to enable it, and you need to add an extra backslash (i.e. \ becomes \\).

This is just an artifact of how it's rendering escape characters.

You can use CSS for everything in your Dash app except for the charts that Plotly generates. So, adding in Google fonts is relatively straightforward - you can either follow the @import instructions add a new css file to your /assets/ folder or you can add it in as an external stylesheet.

1. Load it in to assets:
# \assets\fonts.css

body {
font-family: 'Press Start 2P';
}

1. Add it as an external stylesheet
from dash import Dash, html

external_stylesheets = [