README

Renders local and remote SVG icons in your Contao Twig templates. Adds a icon picker widget to Contao.

Install

Install via Composer or Contao Manager.

composer require pdir/contao-ux-icons-bundle

Usage

{# In your Contao Twig template #}
{{ ux_icon('bi:cart') }}
{{ ux_icon('tdesign:cart-filled') }}
{{ ux_icon('bx:cart') }}
{{ ux_icon('fa-solid:shopping-cart') }}

{{ ux_icon('bi:cart', {style: 'height: 1em;'}) }}
{{ ux_icon('bi:cart', {class: 'size-4'}) }}

{# Example #}
{{ ux_icon('mdi:check', {class: 'w-4 h-4'}) }}

{# Render the "check" icon from "mdi" pack with class #}
<svg viewBox="0 0 24 24" fill="currentColor" class="w-4 h-4">
    <path d="M21 7L9 19l-5.5-5.5l1.41-1.41L9 16.17L19.59 5.59z"/>
</svg>

Icon Sets

Some of the most popular icon sets are shown below; for the complete list, visit https://ux.symfony.com/icons.

Accessibility

{# Informative icons #}
Today's weather:
{{ ux_icon('cloud-rain', {'aria-label': 'Rainy weather'}) }}

{# Functional icons #}
{{ ux_icon('user-profile', {class: 'w-4 h-4', 'aria-label': 'User Profile'}) }}

Credits

UX Icons on Github https://github.com/symfony/ux-icons UX Icons Documentation https://symfony.com/bundles/ux-icons/current/index.html

DEV

First make sure the tools are installed and up to date by running composer bin all update in your bundle's root. Then run the PHP-CS-Fixer and the unit test before you release your bundle:

vendor/bin/ecs check src/ tests/ --fix
vendor/bin/phpunit