Black Lives Matter. Please consider donating to Black Girls Code today.
Dash Enterprise delivers an incredible 21x cost savings 💸Download the e-book!

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:

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.