diff --git a/src/components/UIShell/GlobalHeader/HeaderAction.svelte b/src/components/UIShell/GlobalHeader/HeaderAction.svelte
index b20e513a..af1d313a 100644
--- a/src/components/UIShell/GlobalHeader/HeaderAction.svelte
+++ b/src/components/UIShell/GlobalHeader/HeaderAction.svelte
@@ -2,10 +2,11 @@
   export let type = undefined;
   export let icon = undefined;
   export let isOpen = undefined;
+  export let text = undefined;
 
   let elRigthPanel = undefined;
 
-  import { cx } from '../../../lib';
+  import { cx, optional } from '../../../lib';
   import Icon from '../../Icon/Icon.svelte';
   import { slide } from 'svelte/transition';
 
@@ -23,12 +24,13 @@
 <div>
   <button
     aria-label={type}
-    class={cx('--header__action', isOpen && '--header__action--active')}
+    class={cx('--header__action', isOpen && '--header__action--active', text && '--header__action--text')}
     type="button"
     on:click={() => {
       isOpen = true;
     }}>
     <Icon {...icon} />
+    {optional(text)}
   </button>
   {#if isOpen}
     <div
@@ -38,4 +40,4 @@
       <slot />
     </div>
   {/if}
-</div>
+</div>
\ No newline at end of file
diff --git a/src/components/UIShell/GlobalHeader/HeaderActionLink.svelte b/src/components/UIShell/GlobalHeader/HeaderActionLink.svelte
index 230dee30..7cc90ca6 100644
--- a/src/components/UIShell/GlobalHeader/HeaderActionLink.svelte
+++ b/src/components/UIShell/GlobalHeader/HeaderActionLink.svelte
@@ -3,18 +3,12 @@
   export let type = undefined;
   export let icon = undefined;
   export let linkIsActive = undefined;
-  import { cx } from '../../../lib';
+  export let text = undefined;
+  import { cx, optional } from '../../../lib';
   import Icon from '../../Icon/Icon.svelte';
 </script>
 
 <style>
-  .action-link {
-    text-align: center;
-    align-items: center;
-    vertical-align: middle;
-    justify-content: center;
-    padding-top: 10px;
-  }
   .subject-divider {
     color: #525252;
     padding-bottom: 4px;
@@ -25,8 +19,8 @@
 
 <a
   aria-label={type}
-  class={cx('--header__action', linkIsActive && '--header__action--active')}
-  class:action-link={true}
+  class={cx('--header__action', linkIsActive && '--header__action--active', text && '--header__action--text')}
   {href}>
   <Icon {...icon} />
+  {optional(text)}
 </a>
diff --git a/src/lib/index.js b/src/lib/index.js
index ef3d0b74..b5036e45 100644
--- a/src/lib/index.js
+++ b/src/lib/index.js
@@ -1,3 +1,4 @@
 export { cx } from './cx';
 export { css } from './css';
 export { fillArray } from './fill-array';
+export { optional } from './optional';
diff --git a/src/lib/optional.js b/src/lib/optional.js
new file mode 100644
index 00000000..e5eee638
--- /dev/null
+++ b/src/lib/optional.js
@@ -0,0 +1,3 @@
+const optional = x => x || '';
+
+export { optional };
\ No newline at end of file