WordPress 4.2 Introduces Subtle Refinements to the Default Admin Color Scheme

WordPress 3.8 marked a major milestone for the admin with the inclusion of “MP6,” a brand new responsive design and color scheme. By now many users have become accustomed to the color scheme, but 4.2 will introduce subtle changes to create a more harmonious color palette.

Over the past several months, Hugo Baeta has been working to help document and refine the WordPress.org brand. Baeta works as a designer on WordPress.com. Most recently he has been focusing on evolving the brand and preparing its design handbook.

“In the process, things like a unifying typographic modular scale and the Logotype metrics also got some attention – all in the efforts to unify the brand and make sure it is consistent,” Baeta said. “A couple months ago I asked to switch my gears to .org and help the .org universe get a similar treatment.”

While documenting the colors used by WordPress core, Baeta’s critical eye for color palettes prompted him to explore some subtle changes that would bring greater harmony to the admin color scheme. If you look carefully, you can see that the new admin colors (on the right) have a more bluish hue than the original MP6 colors (left).


“The idea was to make the grays look intentional and refined, by bringing out a subtle blue hue to them,” Baeta said. “I tried to maintain the value (lightness/darkness) of the colors, so that it would be a ‘lateral’ evolution. So, technically there isn’t much change to contrast.”

A closer look at the HEX changes side-by-side shows the subtle evolution from dusty greys/blues to a more true blue hue:


I asked Baeta what his response would be to those who, like one commenter on the announcement post, see the new color scheme as looking “too bluish.”

“It’s all a perception game,” he said. “The technical reality is the change is incredibly subtle, but depending on your monitor calibration and the way your eyes see color, you’ll see more/less blue.

“Let me give you an example of a specific hue breakdown – the main sidebar gray:

before: rgb(51,51,51)
after: rgb(50,55,60)

“Each channel goes 0-255 – so you can see how subtle the change is,” Baeta explained.

Feedback from contributors on the ticket where Baeta proposed the changes was overwhelmingly positive and the new color updates will land in 4.2. Core committer Matt Miklic aptly summarized the overall consensus:

My subjective feeling is that the shift in colors is so slight, it doesn’t really change the feeling we intended to convey with the original MP6 colors. If anything, it makes the grays look more intentional, a color palette designed to work harmoniously rather than pairing a signature shade of blue with a lot of neutral grays.

Why It’s Important for Companies and Projects to Iterate on Branding

Like it or not, users tend to judge software by how it looks. Even the most minute color choices can affect public perception of an application. Most users are not likely to consciously perceive the changes in this round of WordPress admin iterations, but the improved harmony of the colors will make it easier on the eyes.

Baeta believes that companies and open source projects need to be open to iterating on their branding every now and then to keep pace with where the web is going.

“I believe a brand is something we should cherish very dearly,” he said. “It’s a project/company’s most recognizable asset, right? I think iteration should happen in order to achieve refinement and keep a brand relevant.

“Specially when a brand doesn’t begin with a strong set of assets and rules, it allows for the people involved to treat it as they think is best. Eventually atrocities like the fauxgo make everyone regret the absence of rules.”

This is one of the reasons that Baeta is involved in the initiative to document and refine the project’s brand through contributions to WordPress.org’s Design Handbook. Without clear branding guidelines, anyone can take the logo and colors and alter them in ways that muddle the project’s brand as a whole.

“I think the web has evolved greatly since WordPress first started,” Baeta said. “WordPress is now a mature project that deserves to have its very recognizable brand refined and documented to make sure it is protected for years to come.”


13 responses to “WordPress 4.2 Introduces Subtle Refinements to the Default Admin Color Scheme”

  1. When you say ‘subtle’, perhaps you should say very ‘subtle’? I almost couldn’t tell the difference looking at the before and after colour swatches. But then, when looking at the before and after screenshots, the new version makes everything come together better and the page elements look so much more sharp.

    Great job!

  2. Sarah, I love reading your stuff. But, honestly, a full post on this? I know 4.2 is mostly a yawner, but you could have stepped it up on the interest level.

    Like maybe a piece on why innovation at WordPress core has lept to levels that leave many of us mesmerized by the unstoppable creativity being poured into maintaining the status quo. Now that really is awesome!

  3. Run a diff against the codebase (not that I have or would or will) and then you can see what work has been done. Often releases of codebases with any software is not something with big gains readily visible to a user or event a software engineer. Sometimes its alterations or additions in code for any number of reasons, security increases, codebases that need be vamped out in production environments that are to be supporting code for future application infrastructure or any number of other reasons.

    I am sure with a product as mature as WP they dont just go, “Geee… lets make a primary release because we need make things look like we are”… Not at all, I am certain of it.

    But like I said, run a diff against the codebase and you will see it. Simple.

  4. It’s alright if you don’t notice the change; we won’t mind. :) I’m thrilled to see these kind of small improvements to the admin’s visual design, because it’s a perfect example of the way WordPress itself has grown: rarely in big leaps, mostly in small, sometimes imperceptible changes. But when you take a longer view, it’s quite clear how the changes add up.

    Developers who create plugins or build sites for clients should especially take note of the new design handbook. WordPress is really advancing with regard to how seriously it takes its brand and its user interface, and plugins that don’t do the same are going to age rapidly in comparison.


Subscribe Via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

%d bloggers like this: