diff --git a/templates/repo/sub_menu.tmpl b/templates/repo/sub_menu.tmpl
index cf017caaff..7ba234dccf 100644
--- a/templates/repo/sub_menu.tmpl
+++ b/templates/repo/sub_menu.tmpl
@@ -39,7 +39,7 @@
 	</div>
 	<a class="ui segment language-stats">
 		{{range .LanguageStats}}
-		<div class="bar" style="width: {{.Percentage}}%; background-color: {{.Color}}">&nbsp;</div>
+		<div class="bar tooltip" style="width: {{.Percentage}}%; background-color: {{.Color}}" data-placement="top" data-content={{ .Language }}>&nbsp;</div>
 		{{end}}
 	</a>
 	{{end}}
diff --git a/web_src/js/modules/tippy.js b/web_src/js/modules/tippy.js
index 44e97e2a0f..7fc273d1cc 100644
--- a/web_src/js/modules/tippy.js
+++ b/web_src/js/modules/tippy.js
@@ -3,7 +3,7 @@ import tippy from 'tippy.js';
 export function createTippy(target, opts = {}) {
   const instance = tippy(target, {
     appendTo: document.body,
-    placement: 'top-start',
+    placement: target.getAttribute('data-placement') || 'top-start',
     animation: false,
     allowHTML: false,
     maxWidth: 500, // increase over default 350px