How to implement Flags by Country and Language in Laravel


To implement flags by country and language in the Laravel project we are going to use the package called Blade-Flags

A package called Laravel Blade Flags makes it simple to show flags for many nations and languages in your Laravel Blade views. You might look for SVG icons or JS components when you need to display different national flags for a project. If you’re using Blade, this package has your back because you can render flags as components or use the supplied SVGs:


composer require outhebox/blade-flags


   <x-flag-country-np />
   <x-flag-country-cn />
   <x-flag-country-in />
   <x-flag-country-pt />
   <x-flag-country-us />

These blade components renders graphics like this:

Country flags by country code

Country Flags by Languages

You can render country flags by languages as well. to do so, you should use blade components like these:

<x-flag-language-en />
<x-flag-language-ar />
<x-flag-language-es />
<x-flag-language-hi />

This will renders something like:

Class Attributes

Also you can add class names in these components.

<x-flag-country-np class="w-6 h-6"/>

Using SVGs:

To use rawSVGs provided by this package, you will need to publish the package.

php artisan vendor:publish --tag=blade-flags --force

This command will generate SVG icons files in your public/vendor/blade-flags directory of the laravel project. Now, you are all set to use the raw SVGs icons.

<img src="{{ asset('vendor/blade-flags/country-np.svg') }}" width="32" height="32"/>
<img src="{{ asset('vendor/blade-flags/language-ne.svg') }}" width="32" height="32"/>

Sudeep Mishra

Sudeep Mishra


%d bloggers like this: