By default the logo in Modern SharePoint experience is displayed on the left side of the header and there is no option to move it to a different position. However with a few lines of CSS and ShortPoint's Theme Builder, the logo can be moved.


Here is how it looks:


And here is what you can achieve after the tutorial:



Solution

To achieve the desired look, we'll have to add few lines of Custom CSS to ShortPoint Theme Builder.


Step 1

Open ShortPoint Theme Builder (Site Contents > Dashboard > ShortPoint Theme Builder) and navigate to Utilities > Custom CSS:




Step 2

Copy the CSS code below:

[class*=logoCell] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}



Step 3

Paste the copied code in the Custom CSS text area:



After you've pasted the code, the logo should now be displayed in the center of the page. 

If you are happy with the results, click Publish.


That's it!