PHPackages                             xenbyte/font-awesome-svg-twig-bundle - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating & Views](/categories/templating)
4. /
5. xenbyte/font-awesome-svg-twig-bundle

ActiveSymfony-bundle[Templating & Views](/categories/templating)

xenbyte/font-awesome-svg-twig-bundle
====================================

Symfony bundle to use FontAwesome svg icons as inline svg.

1.1.0(2y ago)0656MITPHPPHP >=8.1

Since Dec 22Pushed 2y ago1 watchersCompare

[ Source](https://github.com/xenbytecom/font-awesome-svg-twig-bundle)[ Packagist](https://packagist.org/packages/xenbyte/font-awesome-svg-twig-bundle)[ Fund](https://www.paypal.com/donate/?hosted_button_id=J425R728CYH9N)[ RSS](/packages/xenbyte-font-awesome-svg-twig-bundle/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (2)Dependencies (5)Versions (3)Used By (0)

Font Awesome SVG Twig Bundle for Symfony
========================================

[](#font-awesome-svg-twig-bundle-for-symfony)

This bundle enables the support of [FontAwesome](https://fontawesome.com/) SVG icons as inline output within twig templates.

[![Packagist Version](https://camo.githubusercontent.com/f2c1309b8413535c6c1b9acd6c7ac28b86233ceaed6cc8450cff5a53ca5df2a1/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f78656e627974652f666f6e742d617765736f6d652d7376672d747769672d62756e646c65)](https://camo.githubusercontent.com/f2c1309b8413535c6c1b9acd6c7ac28b86233ceaed6cc8450cff5a53ca5df2a1/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f78656e627974652f666f6e742d617765736f6d652d7376672d747769672d62756e646c65)[![Donate](https://camo.githubusercontent.com/b57c445af971e3e99c2d0ccdbf4fa7faa4358ba27fecc8f68459b30289f82eda/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f446f6e6174652d50617950616c2d626c75652e737667)](https://www.paypal.com/donate/?hosted_button_id=J425R728CYH9N)

Features
--------

[](#features)

- accessability: adds `aria-hidden="true" role="img"` or a title item with `aria-labeledby` as [recommended by Font Awesome](https://fontawesome.com/docs/web/dig-deeper/accessibility)
- supports Font Awesome composer package (contains only free icons) and manually provided icons (including pro icons)
- no Font Awesome's css and javascript files necessarry (just css for icon size in your own stylesheet)

Installation
------------

[](#installation)

To install this package, you can just use composer. Open a command console, enter your project directory and execute:

```
composer require xenbyte/font-awesome-svg-twig-bundle

```

If you don't use Symfony Flex, enable the bundle by adding it to the list of registered bundles in the `config/bundles.php` file of your project:

```
// config/bundles.php
return [
    // ...
    Xenbyte\FontAwesomeSvgTwigBundle\FontAwesomeSvgTwigBundle::class => ['all' => true],
];
```

### Set up Font Awesome

[](#set-up-font-awesome)

#### Option 1: Using the [fortawesome/font-awesome](https://packagist.org/packages/fortawesome/font-awesome) package

[](#option-1-using-the-fortawesomefont-awesome-package)

```
composer require fortawesome/font-awesome

```

The composer package contains only the free icons.

#### Option 2: Provide the font files manually

[](#option-2-provide-the-font-files-manually)

Copy the files within `node_modules/@fortawesome/fontawesome-pro/svgs` to e. g. `assets/fontawesome`.

Configuration
-------------

[](#configuration)

If you need to customize the global bundle configuration, you can create a /config/packages/font\_awesome\_svg\_twig.yaml file with your configuration:

```
font_awesome_svg_twig:
  icon_folder: assets/fontawesome
  svg_class: fa-icon
```

Usage examples
--------------

[](#usage-examples)

```
{{ fa("home") }}
{{ fa("fas home") }}
{{ fa("home", {style: 'solid') }}
{{ fa("home", {style: 'regular', color: '#330000', size: '2rem', class: 'icon') }}
{{ fa("home", {style: 'duotone', color: '#333', secondaryColor: '#999', 'title': 'Title', data-foo) }}
```

Default style is "solid". `{{ fa("home") }}` and `{{ fa("home", {style: solid) }}` will produce the same output.

As an alternative for adding the styles in the options, you can also add a short prefix for some styles, e.g. `{{ fa("fat home") }}` for `{{ fa("home", {style: thin) }}`.

The following prefixes are supported;:

- fas = solid
- far = regular
- fad = duotone
- fat = thin
- fal = light
- fab = brands

It is recommended to add some default css. All icons gets the class `fa-icon`:

```
.fa-icon {
  display: inline-block;
  height: 1em;
  overflow: visible;
  vertical-align: -0.125em;
}
```

Options
-------

[](#options)

- `resource_folder`: Folder with the font awesome icons
- `svg_class`: Class which is added to the svg element

Limitation
----------

[](#limitation)

[Stacking items](https://fontawesome.com/docs/web/style/stack) is currently not possible with this extension.

###  Health Score

26

—

LowBetter than 43% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity15

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity52

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~101 days

Total

2

Last Release

772d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/54ac428ca37085fe58b593d327d047cab7203aeafc7e8b831384c4e4e662586d?d=identicon)[xenbyte](/maintainers/xenbyte)

---

Top Contributors

[![av3](https://avatars.githubusercontent.com/u/5757594?v=4)](https://github.com/av3 "av3 (3 commits)")

---

Tags

fontawesomesymfony-bundlesymfonytwigiconsFontAwesome

###  Code Quality

TestsPHPUnit

Static AnalysisPHPStan

Type Coverage Yes

### Embed Badge

![Health badge](/badges/xenbyte-font-awesome-svg-twig-bundle/health.svg)

```
[![Health](https://phpackages.com/badges/xenbyte-font-awesome-svg-twig-bundle/health.svg)](https://phpackages.com/packages/xenbyte-font-awesome-svg-twig-bundle)
```

###  Alternatives

[twig/extra-bundle

A Symfony bundle for extra Twig extensions

91292.0M315](/packages/twig-extra-bundle)[symfony/ux-icons

Renders local and remote SVG icons in your Twig templates.

545.8M69](/packages/symfony-ux-icons)[yellowskies/qr-code-bundle

Symfony Barcode & QR Code Generator Bundle with Twig extension

36682.9k](/packages/yellowskies-qr-code-bundle)[boekkooi/jquery-validation-bundle

Jquery form validation bundle for symfony 2

2773.9k1](/packages/boekkooi-jquery-validation-bundle)[symfony/ux-toolkit

A tool to easily create a design system in your Symfony app with customizable, well-crafted Twig components

1432.0k](/packages/symfony-ux-toolkit)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)