https://github.com/cecilapp/theme-fontawesome
The Font Awesome component theme for Cecil provides helpers to use Font Awesome icons.
https://github.com/cecilapp/theme-fontawesome
List: theme-fontawesome
cecil cecil-theme-component font icons
Last synced: 5 months ago
JSON representation
The Font Awesome component theme for Cecil provides helpers to use Font Awesome icons.
- Host: GitHub
- URL: https://github.com/cecilapp/theme-fontawesome
- Owner: Cecilapp
- License: mit
- Created: 2023-11-15T13:53:54.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-09-25T13:01:51.000Z (9 months ago)
- Last Synced: 2025-11-16T22:09:49.755Z (7 months ago)
- Topics: cecil, cecil-theme-component, font, icons
- Language: Twig
- Homepage: https://cecil.app/themes/components/
- Size: 1.04 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Font Awesome component theme
The _Font Awesome_ component theme for [Cecil](https://cecil.app) provides helpers to use [Font Awesome icons](https://fontawesome.com/search?o=r&m=free&s=solid%2Cregular&f=brands%2Cclassic).
## Installation
```bash
composer require cecil/theme-fontawesome
```
> Or [download the latest archive](https://github.com/Cecilapp/theme-fontawesome/releases/latest/) and uncompress its content in `themes/fontawesome`.
## Usage
Add `fontawesome` in the `theme` section of the `config.yml`:
```yaml
theme:
- fontawesome
```
Include styles and webfonts in the `` of your template:
```twig
{{ include('partials/fontawesome.twig') }}
```
> By default, it includes _regular_, _solid_, and _brands_ icons, but you can select only the one(s) you want using the `styles` array, i.e.:
> `{{ include('partials/fontawesome.twig', {styles: ['brands']}) }}`
Then import macro in your template:
```twig
{% import 'macros/fontawesome.twig' as fontawesome %}
```
Display the desired icon:
```twig
{{ fontawesome.icon('', '', '<size>', '<rotate>', '<flip>', '<attributes>') }}
```
- `<name>`: name of the [icon](https://fontawesome.com/search?o=r&m=free&s=solid%2Cregular&f=brands%2Cclassic)
- `<style>`: style ("regular", "solid" or "brands". "regular" by default)
- `<size>`: font [size](https://fontawesome.com/docs/web/style/size) (optional)
- `<rotate>`: rotation in degrees ("90", "180", "270" or custom)
- `<flip>`: flipping ("horizontal", "vertical" or "both")
- `<attributes>`: additional HTML attributes (optional)
## Example
```twig
{{ fontawesome.icon(name:'github', style:'brands', size:'xl', attributes:{style: 'color: #333'}) ~}}
```
```html
<i class="fa-github fa-brands fa-xl" style="color: #333">
```