UPDATED 01:58 EDT / JULY 07 2015

NEWS

Material Design Lite brings Google’s design language to websites

It has been a little over a year since Google introduced Material Design and in that time the design language has permeated the Android operating system, Android and iOS apps, and web apps.

On Monday, Google announced Material Design Lite (MDL), a front-end web framework, aimed at bringing Material Design to websites at large. (via 9to5Google)

Google says MDL components are created with CSS, JavaScript, and HTML and can be used in conjunction with any front-end solution web designers and developers may choose to work with. Web pages created with MDL will follow the latest web design standards like browser portability, device independence, and graceful degradation.

MDL is compatible with “all modern evergreen” browsers, including Chrome, Firefox, Opera, Microsoft Edge and Safari and will gracefully degrade to CSS-only in older browsers like IE9.

Designers and developers using MDL have access to a component library of users interface (UI) controls such as buttons, checkboxes, and text fields, adapted to follow Material Design concepts. Also included is a host of specialized UI features like cards, column layouts, sliders, spinners, tabs, typography, and more.

MDL also comes with responsive grids and breakpoints to ensure web pages display correctly regardless of the screen size of the device they are viewed on; a key consideration in web design these days.

Google says MDL is best suited to content-heavy websites such as blogs, marketing pages, and text articles. Google’s developers have built a range of responsive templates it thinks will suit most needs, but users can also add components from MDL to existing frameworks or create their own designs by mixing and matching MDL components.

While Google hopes users will use its MDL theme customizer or pre-built CSS and reference its content delivery network, MDL sources are available for download on GitHub for developers who would like to fork it.

Google claims MDL has few dependencies and, as a result, is simple to install and use – gzipped, the code is only 27KB. The fact that MDL is framework agnostic with a narrow focus makes it easy to add material design to websites, no matter what front-end tool designers and developers use it with.

Image via getmdl.io

A message from John Furrier, co-founder of SiliconANGLE:

Your vote of support is important to us and it helps us keep the content FREE.

One click below supports our mission to provide free, deep, and relevant content.  

Join our community on YouTube

Join the community that includes more than 15,000 #CubeAlumni experts, including Amazon.com CEO Andy Jassy, Dell Technologies founder and CEO Michael Dell, Intel CEO Pat Gelsinger, and many more luminaries and experts.

“TheCUBE is an important partner to the industry. You guys really are a part of our events and we really appreciate you coming and I know people appreciate the content you create as well” – Andy Jassy

THANK YOU