Material Design is adding more guidance on color systems and usability, with a new tool to easily design palettes when creating interfaces. The April 2017 guideline update also adds new recommendations for text fields and designing right-to-left icons.

Simplifying the process of creating, sharing, and applying color palettes, the new tool is web-based and features a simple, clickable interface.

Designers are able to test color schemes on sample UIs and preview across a range of Material Design Components. It is especially useful when creating darker and lighter variations of an app’s primary and secondary colors. Works can be exported through HTML, CSS, or JavaScript in Codepen.

When finished customizing, the tool also allows developers to test if text is readable on different-colored backgrounds. Based on Web Content Accessibility Guidelines legibility standards, it will provide suggestions for minimum text opacity.

In addition to expanding usage basics for text fields, there is a new section on text field boxes for increasing user discoverability. Additionally, there are more resources when dealing with Bidirectionality, including guidance on right-to-left (RTL) icons.

FTC: We use income earning auto affiliate links. More.

Check out 9to5Google on YouTube for more news:

You’re reading 9to5Google — experts who break news about Google and its surrounding ecosystem, day after day. Be sure to check out our homepage for all the latest news, and follow 9to5Google on Twitter, Facebook, and LinkedIn to stay in the loop. Don’t know where to start? Check out our exclusive stories, reviews, how-tos, and subscribe to our YouTube channel

About the Author

Abner Li

Editor-in-chief. Interested in the minutiae of Google and Alphabet. Tips/talk: