Announcing Dash Bio 1.0.0 🎉 : a one-stop-shop for bioinformatics and drug development visualizations.

Linking external / local css

I am trying to link an external/local CSS, however, it doesn’t seem to be linked.

I followed the example in this link: Adding CSS & JS and Overriding the Page-Load Template | Dash for Python Documentation | Plotly

external_stylesheets = [
        'href': 'custom.css',
        'rel': 'stylesheet',

app = dash.Dash(
                {"name": "viewport", "content": "width=device-width, initial-scale=1"}

when I load the app, the custom.css from /assets folder is empty.


.tabs {
  background-color: #444,
  color: #adb5bd,
  verticalAlign: middle,
  font-size: 0.9375rem

.map-style {
  padding: 11% 0px 0px 5px;

.prop-style {
  padding: 0% 0px 0px 2em;

.price-style {
  padding: 5% 0px 0px 0.4em;

.market-style {
  padding: 5% 0px 0px 0.4em;

.date-picker-range {
  width: 300px;

I have also tried /assets/custom.css and it still doesn’t work. My questions, how do you link a local css with dash-bootstrap-component style.

Have you tried visiting in your browser? If Dash has picked your CSS properly it should be accessible there (replace with the appropriate URL if not running locally with default port).

It’s possible this post might be relevant, the fix there was to add __name__ to the Dash constructor.

Adding __name__ to dash constructor was the fix. Thx.