SOLVED

New App Launcher cannot have a white Accent color because controls disappear

%3CLINGO-SUB%20id%3D%22lingo-sub-166124%22%20slang%3D%22en-US%22%3ENew%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166124%22%20slang%3D%22en-US%22%3E%3CP%3EI%20was%20asked%20to%20set%20Accent%20color%20of%20app%20launcher%20to%20light%20gray%20but%20discovered%20the%20new%20app%20launcher%20have%20controls%20that%20inherit%20the%20color%20and%20become%20barely%20visible.%3C%2FP%3E%0A%3CP%3EAs%20displayed%20in%20image%20below%20I%20had%20to%20get%20the%20visual%20identity%20responsible%20to%20come%20up%20with%20another%20option.%3C%2FP%3E%0A%3CP%3EGuess%20what%20happened%20when%20the%20accent%20color%20was%20set%20to%20white%20....%3C%2FP%3E%0A%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20763px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F29315iF0B46612D1943E1F%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20alt%3D%22New%20App%20launcher%20cannot%20be%20white.png%22%20title%3D%22New%20App%20launcher%20cannot%20be%20white.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-166124%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EOffice%20365%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ETheme%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-255424%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-255424%22%20slang%3D%22en-US%22%3E%3CP%3ECome%20see%20what's%20new%20with%20Office.com%20and%20experiences%20built%20into%20Office%20365%20in%20the%20web%20at%20Ignite!%3C%2FP%3E%0A%3CP%3EOur%20sessions%20will%20build%20on%20what%20we%20shared%20last%20year%20with%20the%20redesign%20of%20the%20Office%20365%20app%20launcher%20and%20include%20lots%20of%20live%20demo!%3CBR%20%2F%3E%3CBR%20%2F%3E%3CU%3E%3CSTRONG%3EDemo%20Palooza%3A%20Office.com%20and%20New%20O365%20web%20experiences%3C%2FSTRONG%3E%3C%2FU%3E%3CBR%20%2F%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2FMicrosoft-Ignite-Content-2018%2FDemo-palooza-Office-com-and-new-Office-365-web-experiences%2Fm-p%2F254673%22%20target%3D%22_blank%22%3Ehttps%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2FMicrosoft-Ignite-Content-2018%2FDemo-palooza-Office-com-and-new-Office-365-web-experiences%2Fm-p%2F254673%3C%2FA%3E%3C%2FP%3E%0A%3CP%3E%3CBR%20%2F%3E%3CU%3E%3CSTRONG%3EGoing%20beyond%20the%20waffle%3A%20From%20search%20to%20chat%20and%20more%2C%20what's%20new%20in%20Office%20365%20web%20experiences%20to%20power%20the%20digital%20transformation%3C%2FSTRONG%3E%3C%2FU%3E%3C%2FP%3E%0A%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2FMicrosoft-Ignite-Content-2018%2FGoing-beyond-the-waffle-From-search-to-chat-and-more-what-s-new%2Fm-p%2F220681%23M1579%22%20target%3D%22_blank%22%3Ehttps%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2FMicrosoft-Ignite-Content-2018%2FGoing-beyond-the-waffle-From-search-to-chat-and-more-what-s-new%2Fm-p%2F220681%23M1579%3C%2FA%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-166587%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166587%22%20slang%3D%22en-US%22%3E%3CP%3EFirst%2C%20thank%20you%20for%20calling%20this%20out.%20We%20are%20100%25%20committed%20to%20accessibility.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EWe%20are%20considering%20removing%20the%26nbsp%3Bbehavior%20where%20the%20Office%20365%20app%20launcher%20inherits%20custom%20accent%20colors.%20We%20want%20to%20provide%20flexibility%20to%20customize%20Office%20365%20to%20reflect%20an%20organizational%20brand%2C%20but%20also%20safe%20guard%20against%20the%20creation%20of%20accessibility%20issues%20for%20users.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EIn%20the%20short-term%2C%20the%20work%20around%20is%20to%20select%20another%20custom%20accent%20color%20(like%20you%20have%20done)%20that%20reflects%20organizational%20brand%20color%20in%20the%20header%2C%20but%20also%20allows%20the%20links%20in%20the%20Office%20365%20app%20launcher%20to%20be%20visible%20to%20all%20users.%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-166298%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166298%22%20slang%3D%22en-US%22%3E%3CP%3EThanks%20for%20flagging%20the%20issue%2C%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F1096%22%20target%3D%22_blank%22%3E%40Dean%20Gross%3C%2FA%3E.%20Accessibility%20is%20very%20important.%20I'll%20let%20you%20know%20what%20I%20find%20out.%26nbsp%3B%3C%2FP%3E%0A%3CBLOCKQUOTE%3E%3CHR%20%2F%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F1096%22%20target%3D%22_blank%22%3E%40Dean%20Gross%3C%2FA%3E%20wrote%3A%3CBR%20%2F%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F56%22%20target%3D%22_blank%22%3E%40Tom%20Resing%3C%2FA%3E%26nbsp%3Bthis%20seems%20to%20be%20in%20conflict%20with%20your%20tweet%20announcing%20an%20award%20that%20MS%20received%20for%20accessiblity%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftwitter.com%2Fresing%2Fstatus%2F968660861899255808%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Ftwitter.com%2Fresing%2Fstatus%2F968660861899255808%3C%2FA%3E.%20Can%20you%20help%20get%20this%20UI%20issue%20looked%20at%3F%3C%2FP%3E%0A%3CHR%20%2F%3E%3C%2FBLOCKQUOTE%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-166189%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166189%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F56%22%20target%3D%22_blank%22%3E%40Tom%20Resing%3C%2FA%3E%26nbsp%3Bthis%20seems%20to%20be%20in%20conflict%20with%20your%20tweet%20announcing%20an%20award%20that%20MS%20received%20for%20accessiblity%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftwitter.com%2Fresing%2Fstatus%2F968660861899255808%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Ftwitter.com%2Fresing%2Fstatus%2F968660861899255808%3C%2FA%3E.%20Can%20you%20help%20get%20this%20UI%20issue%20looked%20at%3F%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-166177%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166177%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F192%22%20target%3D%22_blank%22%3E%40Tom%20Batcheler%3C%2FA%3E%26nbsp%3Bmight%20be%20able%20to%20help%20here.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3EI'd%20also%20like%20to%20express%20my%20concerns%20on%20this%2C%20as%20it%20seems%20that%20accessibility%20features%20are%20being%20overlooked%20lately.%20I've%20always%20praised%20Microsoft%20on%20that%20front%2C%20hope%20they%20continue%20delivering...%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-166135%22%20slang%3D%22en-US%22%3ERe%3A%20New%20App%20Launcher%20cannot%20have%20a%20white%20Accent%20color%20because%20controls%20disappear%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-166135%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F209%22%20target%3D%22_blank%22%3E%40Brian%20Levenson%3C%2FA%3E%26nbsp%3Bcan%20you%20get%20the%20right%20people%20to%20look%20into%20getting%20this%20poor%20choice%20of%20fonts%2Fcolors%20fixed%3F%20The%20gray%2Fwhite%20color%20combo%20should%20never%20be%20used%2C%20it%20is%20very%20hard%20for%20many%20people%20to%20read.%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
New Contributor

I was asked to set Accent color of app launcher to light gray but discovered the new app launcher have controls that inherit the color and become barely visible.

As displayed in image below I had to get the visual identity responsible to come up with another option.

Guess what happened when the accent color was set to white ....

New App launcher cannot be white.png

6 Replies
Highlighted

@Brian Levenson can you get the right people to look into getting this poor choice of fonts/colors fixed? The gray/white color combo should never be used, it is very hard for many people to read.

Highlighted

@Tom Batcheler might be able to help here.

 

I'd also like to express my concerns on this, as it seems that accessibility features are being overlooked lately. I've always praised Microsoft on that front, hope they continue delivering...

Highlighted

@Tom Resing this seems to be in conflict with your tweet announcing an award that MS received for accessiblity https://twitter.com/resing/status/968660861899255808. Can you help get this UI issue looked at?

Highlighted

Thanks for flagging the issue, @Dean Gross. Accessibility is very important. I'll let you know what I find out. 


@Dean Gross wrote:

@Tom Resing this seems to be in conflict with your tweet announcing an award that MS received for accessiblity https://twitter.com/resing/status/968660861899255808. Can you help get this UI issue looked at?


 

Highlighted
Best Response confirmed by Tom Resing (Microsoft)
Solution

First, thank you for calling this out. We are 100% committed to accessibility.

 

We are considering removing the behavior where the Office 365 app launcher inherits custom accent colors. We want to provide flexibility to customize Office 365 to reflect an organizational brand, but also safe guard against the creation of accessibility issues for users.

 

In the short-term, the work around is to select another custom accent color (like you have done) that reflects organizational brand color in the header, but also allows the links in the Office 365 app launcher to be visible to all users. 

Highlighted

Come see what's new with Office.com and experiences built into Office 365 in the web at Ignite!

Our sessions will build on what we shared last year with the redesign of the Office 365 app launcher and include lots of live demo!

Demo Palooza: Office.com and New O365 web experiences
https://techcommunity.microsoft.com/t5/Microsoft-Ignite-Content-2018/Demo-palooza-Office-com-and-new...


Going beyond the waffle: From search to chat and more, what's new in Office 365 web experiences to power the digital transformation

https://techcommunity.microsoft.com/t5/Microsoft-Ignite-Content-2018/Going-beyond-the-waffle-From-se...