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

templates/ux_packages/typed.html.twig

{% extends 'base.html.twig' %}

{% block body %}
    <div class="p-5" style="font-size: 1.3em;">
        <span
            {{ stimulus_controller('symfony/ux-typed', {
                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',
                ],
                loop: true,
                showCursor: true,
                cursorChar: '✨',
            }) }}
        ></span>
    </div>
{% endblock %}

Install It

$ composer require symfony/ux-typed
$ npm install --force
$ npm run watch