All platforms

Favicon for Django

How to add a favicon in Django

To add a favicon in Django, place your icon files in an app's static folder (e.g. app/static/favicons/), load the static template tag and reference them with {% static %} in your base template's <head>. In production, run python manage.py collectstatic so the files end up under STATIC_ROOT and are served from STATIC_URL.

What you need

  • favicon.ico plus PNG favicons (32x32), a 180x180 apple-touch-icon, and 192/512 PWA icons.
  • A static folder inside an app (or a STATICFILES_DIRS path), with STATIC_URL configured.
  • collectstatic for production, plus a way to serve /favicon.ico at the root (WhiteNoise or a URL/redirect).

Step-by-step: add a favicon in Django

  1. Generate your icon set. Use Logo2Favicon to create favicon.ico, the PNG sizes, the Apple touch icon, the PWA icons, a maskable icon, and the manifest - all in your browser, nothing uploaded.
  2. Add icons to a static folder. Place the files in an app's static folder, for example app/static/favicons/. Confirm STATIC_URL (commonly /static/) and your staticfiles settings are configured.
  3. Reference them in the base template. At the top of your base template add {% load static %}, then add the icon link tags in <head> using {% static 'favicons/favicon-32x32.png' %} style paths.
  4. Collect static for production. Run python manage.py collectstatic so files are gathered into STATIC_ROOT. In production serve them with WhiteNoise or your web server; in DEBUG mode Django serves them automatically.
Base template <head> ({% load static %} must be at the top of the template):
{% load static %}
<link rel="icon" href="{% static 'favicons/favicon.ico' %}" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="{% static 'favicons/favicon-32x32.png' %}">
<link rel="apple-touch-icon" sizes="180x180" href="{% static 'favicons/apple-touch-icon.png' %}">
<link rel="manifest" href="{% static 'favicons/site.webmanifest' %}">

Common mistakes to avoid

  • Forgetting {% load static %} at the top of the template, so {% static %} errors out or renders nothing.
  • Expecting /favicon.ico at the root - Django serves under STATIC_URL, so add a URL/redirect or use WhiteNoise's root files for the bare path.
  • Skipping collectstatic in production, so the icons 404 because DEBUG is off and Django no longer serves static itself.
  • Hard-coding /static/... paths instead of {% static %}, which breaks if STATIC_URL or a CDN/manifest hashing changes.
Free forever, no sign-up

Generate a complete icon set for Django

One logo in, every file out: favicon.ico, the PNG sizes, the Apple touch icon, Android and PWA icons, a maskable icon, the web manifest, and a copy-paste snippet ready for Django. Free, private, and generated in your browser.

Open the generator

Frequently asked questions

Where do I put the favicon in a Django project?
In an app's static folder (e.g. app/static/favicons/) or a STATICFILES_DIRS path, then reference it with {% static %} in your base template. Run collectstatic for production so the files land under STATIC_ROOT.
Why does /favicon.ico 404 in Django?
Django serves static assets under STATIC_URL (like /static/), not the domain root. To answer a bare /favicon.ico, add a URL pattern or redirect to the static file, or let WhiteNoise serve root files such as favicon.ico.
Do I need collectstatic for the favicon?
In production, yes. With DEBUG=False Django stops serving static files itself, so run python manage.py collectstatic to gather them into STATIC_ROOT where WhiteNoise or your web server serves them. In DEBUG mode it works without it.
How do I reference the favicon in a Django template?
Add {% load static %} at the top of the template, then use {% static 'favicons/favicon.ico' %} in the href of your link tags. This builds the correct STATIC_URL path and survives CDN or manifest-hashing changes.

Favicon guides for other platforms

New to favicons? Read the complete favicon guide and the icon size cheatsheet, or jump straight to the favicon generator.