{% trans "Tailwind CSS Language Selector Examples" %}

{% trans "Dropdown Style" %}

{% trans "Select element with Tailwind styling" %}

{% trans "Choose Language" %}

{% trans "Custom Style" %}

{% trans "With Icon" %}

{% trans "List Style" %}

{% trans "Vertical list with hover effects" %}

{% language_selector style='list' %}

{% get_available_languages as LANGUAGES %} {% get_current_language as LANGUAGE_CODE %} {% for lang_code, lang_name in LANGUAGES %} {% if lang_code == LANGUAGE_CODE %}

{{ lang_name }} {% trans "Active" %}

{% else %} {{ lang_name }} {% endif %} {% endfor %}

{% trans "Inline Style" %}

{% trans "Horizontal pills for navigation bars" %}

{% language_selector style='inline' %}

{% get_available_languages as LANGUAGES %} {% get_current_language as LANGUAGE_CODE %} {% for lang_code, lang_name in LANGUAGES %} {% if lang_code == LANGUAGE_CODE %} {{ lang_code|upper }} {% else %} {{ lang_code|upper }} {% endif %} {% endfor %}

{% for lang_code, lang_name in LANGUAGES %} {% if lang_code == LANGUAGE_CODE %} {{ lang_name }} {% else %} {{ lang_name }} {% endif %} {% endfor %}

{% trans "Dark Mode Support" %}

{% trans "All components work with Tailwind's dark mode" %}

{% trans "Dropdown" %}

{% trans "Pills" %}

EN KO JA

{% trans "Real-world Examples" %}

{% language_selector style='inline' %}