Optimizing Your SharePoint Site: The Perfect Banner Size
In the digital age, first impressions matter. For your SharePoint site, this often begins with your banner. A well-designed, appropriately sized banner can instantly engage users and convey your brand's personality. But what is the ideal SharePoint banner size? Let's delve into this crucial aspect of SharePoint customization.
Understanding SharePoint Banner Dimensions
SharePoint banners, also known as site logos, are displayed at the top left corner of your site. They are a key visual element that helps establish your site's identity. To ensure your banner looks its best, it's essential to understand SharePoint's recommended dimensions.
Default Banner Size in SharePoint
Out of the box, SharePoint expects a banner image to be 200 pixels wide and 60 pixels tall. This is the standard size for most modern SharePoint themes. However, this doesn't mean you can't use larger or smaller images. SharePoint is flexible and can accommodate different sizes, but let's explore why these dimensions are recommended.

Why the Default Banner Size Matters
- Consistency: The default size ensures consistency across your site and others in your organization that use the same theme.
- Responsiveness: At 200x60 pixels, the banner maintains its clarity and proportions across various screen sizes and devices.
- Branding: This size allows for clear, recognizable branding. It's large enough to be visible and distinctive, yet small enough not to overwhelm the rest of your site's content.
Using Different Banner Sizes in SharePoint
While the default size offers numerous benefits, SharePoint allows for flexibility. You might want to use a different size for specific purposes, such as:
- Creating a unique, eye-catching design for a specific site or page.
- Highlighting a particular event, promotion, or announcement.
- Aligning with a unique branding guideline or requirement.
Responsive Design Considerations
When using different banner sizes, it's crucial to consider responsive design. Ensure your banner looks good on various devices and screen sizes. This might involve using different images for different screen resolutions or employing CSS media queries to adjust the banner's size and position.
Best Practices for SharePoint Banners
Regardless of the size you choose, here are some best practices to keep in mind:

- Use high-quality, relevant images that align with your brand.
- Keep the file size small to ensure fast loading times.
- Consider using a transparent PNG image to avoid a white box behind your banner.
- Test your banner on various devices and screen sizes to ensure it looks good everywhere.
Changing the Banner Size in SharePoint
To change the banner size in SharePoint, you'll need to modify the CSS. This involves adding custom CSS to your site's theme or using SharePoint's built-in design manager. Here's a simple example of how you might change the banner size using CSS:
.ms-siteicon-img { |
width: 250px !important; |
height: 75px !important; |
} |
In this example, we're changing the width to 250 pixels and the height to 75 pixels. The !important rule ensures that these styles take precedence over any other styles that might be applied to the banner.
Remember, changing the banner size can affect the layout and appearance of your site. Always test thoroughly and consider the user experience when making changes.























