Theming Error: Facing issue in Changing App Icon and Loading icon in Apache Superset 6.0.0

[ypandey-fluidata]

Bug description

Application display name (Top-left header & browser title)

APP_NAME = "FD"

Path must resolve inside Superset static assets

APP_ICON = "/static/assets/images/logo_trans_v1.png"
APP_ICON_WIDTH = 150

Redirect target when clicking the logo

LOGO_TARGET_PATH = "/"

Tried changing the app icon and also replaced loading.cff8a5da.gif in the specific path for new loading icon but it gets automatically changed or image gets disrupted. Need a permanent fix.

Screenshots/recordings

No response

Superset version

master / latest-dev

Python version

3.9

Node version

16

Browser

Chrome

Additional context

No response

Checklist

• I have searched Superset docs and Slack and didn't find a solution to my problem.
• I have searched the GitHub issue tracker and didn't find a similar bug report.
• I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

[dosubot]

In Superset 6.0.0, the way to permanently change the app icon has changed: the old APP_ICON and APP_NAME config options are deprecated and ignored if any theme config is present. Branding is now managed through the theming system using THEME_DEFAULT and THEME_DARK in your superset_config.py. To set a custom logo, add something like:

THEME_DEFAULT = {
    "token": {
        "brandLogoUrl": "/static/assets/images/your_logo.png",  # your logo path
        "brandLogoAlt": "Your App Name",                        # alt text
        # ...other theme tokens...
    }
}
THEME_DARK = {
    "token": {
        "brandLogoUrl": "/static/assets/images/your_dark_logo.png",
        # ...other tokens...
    }
}

Reference

For the loading icon (spinner), there is no theme token for it. It's a static asset bundled by the frontend build. To change it permanently, replace the source image (e.g., loading.gif) in superset-frontend/src/assets/images/ with your custom version, then rebuild the frontend with the appropriate npm build command. Do not replace files directly in superset/static/assets/images—these get overwritten on every build or deployment due to the asset pipeline and content hashing. Reference

Important: Superset 6.0.0+ requires Node 20.x for frontend builds. Using Node 16 or 18 can cause build failures or missing assets, which may prevent your customizations from appearing. Reference

After updating assets and rebuilding, clear your browser cache and localStorage to see the changes, especially if you've used the Theme Editor before.

If you are running in a multi-tenant or advanced deployment, make sure the database is migrated and theme seeding is complete, as themes are now also synced to the database. Reference

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[shashbha14]

I would love to work on this issue.Please assign this issue to me.

[ypandey-fluidata]

THEME_DEFAULT = {
"algorithm": "default",
"token": {

    "fontFamily": "Inter, sans-serif",
    "fontUrls": [
        "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
    ],

    
    "fontSizeHeading1": 40,
    "fontSizeHeading2": 32,
    "fontSizeHeading3": 26,
    "fontSizeHeading4": 22,
    "fontSizeHeading5": 18,

    
    "lineHeight": 2,
    "lineHeightHeading1": 1.5,
    "lineHeightHeading2": 1.38,
    "lineHeightHeading3": 1.26,
    "lineHeightHeading4": 1.12,
    "lineHeightHeading5": 1,

    
    "colorSuccessBg": "#5ac189",
    "colorWarningBg": "#B12CFE",
    "colorErrorBg": "#ff6b6b",

    "brandIconMaxWidth": 150,
    "brandLogoHeight": "40px",
    "brandLogoMargin": "10px 10px 10px 0px",
    "brandLogoUrl" : "/static/assets/images/logo_trans_v1.png"
    "brandSpinnerUrl": "/static/assets/images/loading.gif"
}

}

also

Specify the App icon

APP_ICON = "/static/assets/logo_trans_v1.png"

Redirect target when clicking the logo

LOGO_TARGET_PATH = "/"

the issue I am facing is the icon changes, loading icon also changes but after sometime it gets removed automatically I checked my console when this happened through putty it was visible in folder and when the image crashed i immediately checked the folder both logo and spinner images got removed.

[msyavuz]

Do you have any clear reproduction steps @ypandey-fluidata?

[rusackas]

... if not, the issue may be closed at some point. That said, I'll take a look at the linked PR, and anyone is welcome to test it out and report back.

[rusackas]

Pr updated and (hopefully) ready to merge if/when it passes CI.

[syafiqmuda]

what is the solution, why my dashboard suddenly become white screen when I try to add this in

superset_config_docker.py:

THEME_DEFAULT = {
  "token": {
    "brandAppName": "TEST",  # Window titles
    "brandLogoAlt": "TEST",  # Logo alt text
    "brandLogoUrl" : "/static/assets/images/superset-logo-horiz-custom.png",
  }
}

THEME_DARK = {
  "token": {
    "brandLogoUrl" : "/static/assets/images/superset-logo-horiz-custom.png",
  }
}

[onionhammer]

what is the solution, why my dashboard suddenly become white screen when I try to add this in

superset_config_docker.py:

THEME_DEFAULT = {
  "token": {
    "brandAppName": "TEST",  # Window titles
    "brandLogoAlt": "TEST",  # Logo alt text
    "brandLogoUrl" : "/static/assets/images/superset-logo-horiz-custom.png",
  }
}

THEME_DARK = {
  "token": {
    "brandLogoUrl" : "/static/assets/images/superset-logo-horiz-custom.png",
  }
}

Did you try

THEME_DARK = {
    "token": {
        "brandLogoUrl": "/static/assets/images/superset-logo-horiz-custom.png",
    },
    "algorithm": "dark",
}

[syafiqmuda]

@onionhammer TQ for the reply, I have found my solution (not the best) but I simply use superset theme here:

then set the default.