diff --git a/src/webui/src/components/Header/index.js b/src/webui/src/components/Header/index.js
index 987bb204a..3243aed20 100644
--- a/src/webui/src/components/Header/index.js
+++ b/src/webui/src/components/Header/index.js
@@ -2,6 +2,7 @@ import React from 'react';
 import {Form, Button, Dialog, Input, Alert} from 'element-react';
 import isString from 'lodash/isString';
 import isNumber from 'lodash/isNumber';
+import capitalize from 'lodash/capitalize';
 import {Link} from 'react-router-dom';
 
 import API from '../../../utils/api';
@@ -134,9 +135,10 @@ export default class Header extends React.Component {
 
   renderUserActionButton() {
     if (!this.isTokenExpire) { // TODO: Check jwt token expire
+      const username = capitalize(storage.getItem('username'));
       return (
         <div className="user-logged">
-          <span className="user-logged-greetings" style={ {marginRight: '10px'} }>Hi, {storage.getItem('username')}</span>
+          <span className="user-logged-greetings" style={{marginRight: '10px'}}>Hi, {username}</span>
           <Button className={`${classes.headerButton} header-button-logout`} type="danger" onClick={this.handleLogout}>Logout</Button>
         </div>
       );
diff --git a/test/e2e/e2e.spec.js b/test/e2e/e2e.spec.js
index 646c007b5..90e1d19ed 100644
--- a/test/e2e/e2e.spec.js
+++ b/test/e2e/e2e.spec.js
@@ -97,7 +97,7 @@ describe('/ (Verdaccio Page)', () => {
       // check whether user is logged
       const greetings = await page.evaluate(() => document.querySelector('.user-logged-greetings').textContent);
       const buttonLogout = await page.$('.header-button-logout');
-      expect(greetings).toMatch('Hi, test');
+      expect(greetings).toMatch('Hi, Test');
       expect(buttonLogout).toBeDefined();
     });