It doesn't stand out like it used to. While Outlook.com users can't go back to the old web interface, both Outlook.com and Office 365 users can change the theme if the default colors are hard to see. To change the theme, click on the Gear icon (in the nav bar, to the left of the user picture or the person icon) and choose Change Theme.

• Change Outlook Color Scheme 2010
• Change Outlook Color Scheme
• How To Change Outlook Color Scheme Office 365

For the month of October we are focusing on all things dark mode, so to take a bite size approach to email development we’re progressively enhancing our newsletter Email Weekly every week. Last week saw us focus on our logo and we discussed why you need a dark mode logo. This week we wanted to make sure the text in Email Weekly was exactly how we wanted it to be.

• The default color scheme of Microsoft Office 2010 is silver. Two additional color schemes — blue and black — are available. The color scheme changes the user interface background of the Outlook program window and backgrounds for most program elements including the Navigation Pane, To-Do-Bar, ribbon, message headers, and forms for contacts and tasks.
• Dec 30, 2019 Open Outlook, Click Tools, Options. Click Mail Format Tab, then Click the Editor Options Button. Under the Popular Tab, Click the Color Scheme Down Arrow. Select between Blue, Silver.

Why do I need to do anything?

Email clients that have a dark mode setting will invert background and text colors, this could mean your text will change to a color that doesn’t fit with your brand or in some cases make it un-readable - such as on top of a background image.

What can I do?

You can just leave the text to invert - if it is still legible and working, a user has chosen dark mode and may find it easier to digest your content that way. We don’t suggest trying to force your email to be exactly the same as it is in the light version - not only are you possibly making it harder for someone who has chosen dark mode, but a bright white email in a stream of dark ones could be off putting in the inbox, which could earn you a spam report or unsubscribe.

Using CSS we can target some clients and have some control over text colors. Similar to the CSS in the image swap blog post, we use the meta tags to ensure Apple Mail 12.0 will listen to our dark mode specific styling:

<meta name='color-scheme'>

<meta name='supported-color-schemes'>

Then we can target email clients supporting the prefers-color-scheme, dark, media query:

@media (prefers-color-scheme: dark) {...}

Lastly we duplicate any styles in the media query and add the attribute selectors to target Outlook apps:

[data-ogsc] .class {...}

[data-ogsb] h1 {...}

For emailweekly and for most templates, instead of targeting each specific piece of text with it’s own class or id - we used element selectors, such as h1, p, td to control as much of the styling, with as little CSS as possible:

h1, h2, h3, p, a {

color: rgb(255, 255, 255) !important;

-webkit-text-fill-color: rgb(255, 255, 255) !important;

}

Using the color attribute you can control the text color, then more specifically targeting -webkit-text-fill-color - the text-fill-color property has preference over just color and ensures more support across devices and in browsers than just the color attribute.

All of the clients currently supporting dark mode change hex colors into rgb - they also check for contrast with the background color. If you specify the rgb(...) color there is a higher chance the color you are expecting will display, but hex codes, #ffffff, still work. Lastly we add !important to the attributes to override any inline color styles email clients try to add. In the end all of the text color dark mode control is quite short for emailweekly:

@media (prefers-color-scheme: dark) {

h1, h2,h3, p, a {

color: rgb(255, 255, 255) !important;

-webkit-text-fill-color: rgb(255, 255, 255) !important;

}

[data-ogsb] h1, [data-ogsb] h2,[data-ogsb] h3, [data-ogsb] p, [data-ogsb] a {

color: rgb(255, 255, 255) !important;

-webkit-text-fill-color: rgb(255, 255, 255) !important;

}

See the Pen Controlling text colors in Dark Mode - HTML/CSS email by Jay (@emailjay) on CodePen.

Throughout Darktober and into 2021 our aim is to get every brand dark mode ready. We are helping brands review how dark mode affects them from a quick review, to in depth audits. As well as supporting updating your email design systems and bespoke templates, we have you covered. Just email hello@actionrocket.co and we will be in touch.

As the admin of your organization, you can create multiple themes for the people in your organization, and select which themes apply to different members of your organization. The organization theme is what appears in the top navigation bar for people in your organization.

You can add or update a default theme that applies to everyone within your org. You can also create up to four additional group themes that can be assigned to multiple Microsoft 365 groups.

Add or update your organization's theme

1. In the admin center, go to the Settings > Org Settings page, and then choose the Organization profile tab.

2. On the Organization profile tab, select Custom themes.

Change Outlook Color Scheme 2010

All organization themes can be customized using the following tabs.

General: Modify a theme

Your experience on the General tab depends on whether you're adding or modifying the default theme or a group theme.

Update the default theme

The default theme is the first theme displayed.

1. If you previously customized a theme for your organization, select Default Theme and use one of your saved customizations, or, select Add theme.
2. On the General page, you can prevent users from overriding their theme and show the user’s display name.
3. Select Save to save your changes.

Important

The default theme is unique, it can't be renamed and applies to everyone within your organization. To delete the default theme, you have to delete all other themes first.

Create a group theme

You can create up to four additional group themes.

1. On the General page, enter a name for your new theme.

2. Under Groups, you can select up to 5 Microsoft 365 Groups that can see your group theme, instead of using the default theme. You can also prevent users from overriding their theme and show the user's display name.

3. Select Save.

Logos: Specify your theme logos

On the Logos page, you can you can add your logos, and specify the URL where users will navigate to, when they select the logo.

• Default logo: Add a URL location that points to your logo. Make sure that the URL uses HTTPS. Add a HTTPS image url that allows anonymous access and doesn't require authentication. For default theme, you also have an option to upload a logo image that is less than 10kb. Your default logo can be in the JPG, PNG, GIF, or SVG format. For SVG images, they will be resized to fit 24 pixels vertically. JPG, PNG, GIF images will be scaled to fit 200 x 48 pixels. Logo aspect ratio will always be preserved.
• Alternate logo: Add a URL location that points to your logo. Your alternate logo should be optimized for use in Office dark themes. Same requirements as the default logo.
• On-click link: Add a URL location that points to your logo. You can use your logo as a link to any company resource, for example, your company's website. If you don’t select a URL location for your logo, it’ll default to the Office home page.

Select Save to save your changes.

You can remove your logos at any time. Just return to the Logos page and select Remove.

Colors: Choose theme colors

On the Colors page, you can set the default colors and choose which logo should be used.

• Navigation bar color: Select a color to use for the background of the navigation bar. The navigation bar appears at the top on every page.
• Text and icon color: Select a color to use for the text and icons on the top navigation bar.
• Accent color: Pick one that shows up well on a white or light background. The accent color is used to color some links and buttons that show up on a white or light background. For example, the accent color is used to color elements in a user's inbox and on their Office.com portal page.
• Reset color: Select this link to reset colors to the default colors.

Frequently asked questions

My organization already has a theme for all employees. How will this change?

The default theme will continue to be shown to all employees. Adding a new group theme will only be made available to the Microsoft 365 groups associated with that theme.

Why don’t I see group themes in the Admin Center?

Only global admins can customize company themes. Global readers have read-only access.

How many different themes can I set up for my organization?

Up to five themes can be created. A default theme and four group themes.

Can I use security groups or distribution groups instead of Microsoft 365 Groups?

No, new group themes must be mapped to one or more Microsoft 365 groups and not security groups or distribution groups.

Note

You can convert distribution groups to Microsoft 365 groups in Outlook.

Change Outlook Color Scheme

Can I manually assign a theme independent of Microsoft 365 Groups? 

No, new group themes must be mapped to one or more Microsoft 365 groups. Users who are members of the Microsoft 365 group will get the theme applied to their group. You can create and add new members to a Microsoft 365 Group by going to the Settings > Groups in the admin center.

How To Change Outlook Color Scheme Office 365

What happens if a user is assigned to multiple group themes?

Users who are assigned to multiple group themes will be shown the default theme.

Why can’t I delete the default theme? 

The default theme can only be deleted once all group themes are deleted. Make sure you delete all group themes before you try to delete the group theme.

Why am I receiving an error message every time I upload a logo URL. 

Make sure the logo you’re using is specified as a publicly addressable URL. Follow these steps for uploading logos to Azure Blob Storage or the Office 365 Content Delivery Network with SharePoint Online.

Why am I receiving the message “Doesn’t meet minimum color contrast ratio of 4.5:1”?

The recommended contrast ratio between text, icon or button color and background color is 4.5:1. You can override this recommendation and still save your theme as this is not a requirement.

If I define a theme, which places in Microsoft 365 will this be used?

Any theme appears in the top navigation bar for everyone in the organization as part of the Microsoft 365 suite header.

Related content

Add custom tiles to the My apps page and app launcher (article)
Overview of Microsoft 365 Groups for administrators (article)