flowbite-beardedtek.com/layouts/partials/hero/slider.html

        <div class=" max-w-xs text-2xl md:text-3xl lg:text-4xl kanit-semibold mx-auto text-center dark:text-white pt-4 md:pt-6">
            <div id="default-carousel" class="relative w-full text-primary-600 dark:text-gray-400" data-carousel="slide">
                <!-- Slider wrapper -->
                <div class="relative h-10 overflow-hidden rounded-lg">
                    {{ range $index, $element := .Page.Params.hero.wordSlider.items }}
                    <!-- Slider Item #{{ $index }} -->
                    <div class="hidden duration-700 ease-in-out" data-carousel-item>
                        {{ . }}
                    </div>
                    {{ end }}
                </div>
            </div>
        </div>