You're viewing docs for v5.15.4, an older version of Font Awesome.

Web

Python + Django

Font Awesome now has an official Django plugin that's available via the Python package installer, pip, for a friction-less way to use our icons in your Django projects.

Advertisement

Version 5 Deprecation

We found an issue with the way we named the python package. This will be fixed in version 6. As a result we will deprecate the version 5 packages once version 6 is up and running.

Holy Beta, Batman!

Our Django plugin is still in beta and may have some rough edges. We hope you find it useful, but be mindful that it may be subject to larger changes before it's official release. If you've got ideas on how it can be better or found a bug to be squashed, let us know!

What's installed with the the Font Awesome Package?

Once installed, the web-focused Font Awesome package contains the following directories and files:

Path What It Is Where You Should Start
/css Stylesheets for Web Fonts all.css
/js SVG with JavaScript all.js
/less Less pre-processor fontawesome.less
/scss Sass pre-processor fontawesome.scss
/sprites SVG sprites solid.svg
/svgs Individual SVG for each icon individual *.svg icons
/webfonts Web Font files used with CSS See /css

Ch-Ch-Check Yourself and Reqs Yourself!

We recommend using requirements files in your Python projects to install the Font Awesome package. The docs below assume that you're working this way.

Using the Free Version of Font Awesome

Advertisement

Start by adding Font Awesome Free to your project's requirements by placing this in your project's requirements.txt file (opens new window) and replace version_number with the version of Font Awesome you are using.

  INSTALLED_APPS = [
    'fontawesome-free'
  ]

Then, reference the installed files in the <head> section of your base template if you want to use Font Awesome in your entire project or in the <head> section of any individual files where you want to use Font Awesome.

  <head>
    <!-- reference your installed Font Awesome Free package's files here -->
    <script src="{% static 'fontawesome_free/js/all.min.js' %}"></script>
  </head>

If you'd prefer to use our Web Font + CSS technology, add a <link> element like below:

  <head>
    <!-- reference your installed Font Awesome Free package's files here -->
    <link href="{% static 'fontawesome_free/css/all.min.css' %}" rel="stylesheet" type="text/css">
  </head>

Want just certain styles of icons? - If you would like only to use specific styles rather than the default all option we've included in our Web Fonts and SVG technology, reference the specific style files you want to use like fa-brands or fa-regular and then the loader fontawesome file in place of all.

  <head>
    <!-- Our project just needs Font Awesome Free's Solid + Brand files -->
    <link href="{% static 'fontawesome_free/css/fontawesome.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'fontawesome_free/css/brands.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'fontawesome_free/css/solid.css' %}" rel="stylesheet" type="text/css">
  </head>

Using the Pro version of Font Awesome for Django

Access to the Pro package, which contains more icons and styles, requires you to have both an active subscription to a Pro Plan and a valid Pro Package Token. Don't have a Pro plan? Get one today and Python on...

Keep It Secret, Keep It Safe!

Grab your super-secret npm token from your account and don't share it with anyone who shouldn't have it. We'll wait here...

Start by adding Font Awesome Pro to your project's requirements by placing this in your project's requirements.txt file (opens new window) and replace version_number with the version of Font Awesome you are using.

--extra-index-url https://dl.fontawesome.com/TOKEN/fontawesome-pro/python/simple/
fontawesomepro==version_number

Next, add Font Awesome Pro to your Django installation by adding 'fontawesomepro' to the INSTALLED_APPS (opens new window) in your Django settings.py file.

  INSTALLED_APPS = [
    'fontawesomepro'
  ]

Then, reference the installed files in the <head> section of your base template if you want to use Font Awesome in your entire project or in the <head> section of any individual files where you want to use Font Awesome.

  <head>
    <!-- reference your installed Font Awesome Pro package's files here -->
    <script src="{% static 'fontawesomepro/js/all.min.js' %}"></script>
  </head>

If you'd prefer to use our Web Font + CSS technology, add a <link> element like below:

  <head>
    <!-- reference your installed Font Awesome Pro package's files here -->
    <link href="{% static 'fontawesomepro/css/all.min.css' %}" rel="stylesheet" type="text/css">
  </head>

Want just certain styles of icons? -- If you would like only to use specific styles rather than the default all option we've included in our Web Fonts and SVG technology, reference the specific style files you want to use like fa-brands or fa-regular and then the loader fontawesome file in place of all.

  <head>
    <!-- Our project just needs Font Awesome Pro's Solid + Brand files -->
    <link href="{% static 'fontawesomepro/css/fontawesome.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'fontawesomepro/css/brands.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'fontawesomepro/css/solid.css' %}" rel="stylesheet" type="text/css">
  </head>
  <body>
    <i class="fa-solid fa-user-chef"></i> <!-- uses solid style -->
    <i class="fa-brands fa-github-square"></i> <!-- uses brand style -->
  </body>

Next Steps

Pre-launch prep all complete and ready to blast off? After you get things installed, check out all of our icons and learn how to reference them in HTML.