A Library that Types

Typed brings text to life

Spice up some text by typing, backspacing and re-typing with Typed.js.

composer require symfony/ux-typed
{% extends 'base.html.twig' %}

{% block body %}
    <div class="p-5" style="font-size: 1.3em;">
        {% set strings = [
            'I ❤️ Symfony UX!',
            'Symfony UX Typed loves to type',
            'Symfony UX Typed and backspace',
            'Control the speed',
            'Control the cursor',
            'Control your destiny!!!',
            'Control your destiny... sort of',
        ] %}
        <span
            data-controller="symfony--ux-typed"
            data-symfony--ux-typed-loop-value="true"
            data-symfony--ux-typed-show-cursor-value="true"
            data-symfony--ux-typed-cursor-char-value="✨"
            data-symfony--ux-typed-strings-value="{{ strings|json_encode|e('html_attr') }}"
        ></span>
    </div>
{% endblock %}

Install It

$ composer require symfony/ux-typed