diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index 8140943c9c9..00619cefd25 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -873,6 +873,7 @@ header {
     height: 1.5em;
     margin-right: 0.2em;
     border-radius: $rounded-pill;
+    vertical-align: top;
 }
 
 // Figure with special style
diff --git a/addons/website/views/website_templates.xml b/addons/website/views/website_templates.xml
index 3a25ef492df..1ef6cadb956 100644
--- a/addons/website/views/website_templates.xml
+++ b/addons/website/views/website_templates.xml
@@ -593,7 +593,7 @@
 
 <!-- Language selector templates -->
 <template id="lang_flag" name="Language Flag">
-    <img class="o_lang_flag align-top" t-att-src="'/web/image/res.country/' + str(env.ref('base.' + lang_code.split('_')[1].lower()).id) + '/image'"/>
+    <img class="o_lang_flag" t-attf-src="#{flag_image_src}?height=25"/>
 </template>
 
 <template id="language_selector_add_language">
@@ -622,12 +622,12 @@
     <!-- Add the 'flags' possibility -->
     <xpath expr="//button[hasclass('dropdown-toggle')]/span" position="before">
         <t t-if="flags" t-call="website.lang_flag">
-            <t t-set="lang_code" t-value="active_lang[0]"/>
+            <t t-set="flag_image_src" t-value="active_lang[4]"/>
         </t>
     </xpath>
     <xpath expr="//*[hasclass('js_change_lang')]/span" position="before">
         <t t-if="flags" t-call="website.lang_flag">
-            <t t-set="lang_code" t-value="lg[0]"/>
+            <t t-set="flag_image_src" t-value="lg[4]"/>
         </t>
     </xpath>
 </template>
diff --git a/odoo/addons/base/data/res_lang_data.xml b/odoo/addons/base/data/res_lang_data.xml
index 309b5e2642c..8ed3dc51be3 100644
--- a/odoo/addons/base/data/res_lang_data.xml
+++ b/odoo/addons/base/data/res_lang_data.xml
@@ -7,5 +7,8 @@
         <record id="base.lang_my" model="res.lang">
             <field name="url_code">mya</field>
         </record>
+        <record id="base.lang_ar" model="res.lang">
+            <field name="flag_image" type="base64" file="base/static/img/lang_flags/lang_ar.png"/>
+        </record>
     </data>
 </odoo>
diff --git a/odoo/addons/base/models/res_lang.py b/odoo/addons/base/models/res_lang.py
index f3f54eb3e96..f467b901b0b 100644
--- a/odoo/addons/base/models/res_lang.py
+++ b/odoo/addons/base/models/res_lang.py
@@ -48,6 +48,17 @@ class Lang(models.Model):
     decimal_point = fields.Char(string='Decimal Separator', required=True, default='.', trim=False)
     thousands_sep = fields.Char(string='Thousands Separator', default=',', trim=False)
 
+    @api.depends('code', 'flag_image')
+    def _compute_field_flag_image_url(self):
+        for lang in self:
+            if lang.flag_image:
+                lang.flag_image_url = f"/web/image/res.lang/{lang.id}/flag_image"
+            else:
+                lang.flag_image_url = f"/base/static/img/country_flags/{lang.code.lower().rsplit('_')[-1]}.png"
+
+    flag_image = fields.Image("Image")
+    flag_image_url = fields.Char(compute=_compute_field_flag_image_url)
+
     _sql_constraints = [
         ('name_uniq', 'unique(name)', 'The name of the language must be unique !'),
         ('code_uniq', 'unique(code)', 'The code of the language must be unique !'),
@@ -216,7 +227,7 @@ class Lang(models.Model):
         return langs.get_sorted()
 
     def get_sorted(self):
-        return sorted([(lang.code, lang.url_code, lang.name, lang.active) for lang in self], key=itemgetter(2))
+        return sorted([(lang.code, lang.url_code, lang.name, lang.active, lang.flag_image_url) for lang in self], key=itemgetter(2))
 
     @tools.ormcache('self.id')
     def _get_cached_values(self):
diff --git a/odoo/addons/base/static/img/lang_flags/lang_ar.png b/odoo/addons/base/static/img/lang_flags/lang_ar.png
new file mode 100644
index 00000000000..7f2a13f0875
Binary files /dev/null and b/odoo/addons/base/static/img/lang_flags/lang_ar.png differ
diff --git a/odoo/addons/base/views/res_lang_views.xml b/odoo/addons/base/views/res_lang_views.xml
index 6a1d4232b37..52edb9fba6e 100644
--- a/odoo/addons/base/views/res_lang_views.xml
+++ b/odoo/addons/base/views/res_lang_views.xml
@@ -33,6 +33,7 @@
                                 class="oe_stat_button"
                                 icon="fa-refresh" />
                         </div>
+                        <field name="flag_image" widget="image" class="oe_avatar"/>
                         <div class="oe_title">
                             <label for="name" class="oe_edit_only"/>
                             <h1><field name="name"/></h1>