Created and designed by Google, material design is a design language that combines the classic principles of successful design along with innovation and technology. The goal is to develop a system of design that allows for a unified user experience across any platform.
Material is a metaphor for the unifying theory of rationalized space and a system of motion. Grounded in tactile reality, inspired by the study of paper and ink, yet technologically advanced and open to innovation. Surfaces and edges of the material provide visual cues that are grounded in reality, and inspire the user to interact.
The foundational elements of print-based design – typography, grids, space, scale, color, and use of imagery – guide visual treatments. These elements create hierarchy, meaning, and focus. Deliberate color choices, edge-to-edge imagery, clear typography, and intentional white space create a bold and graphic interface that immerse the user in the experience.
Primary user actions are inflection points that initiate motion, transforming the whole design. All action takes place in a single environment. Objects are presented to the user without breaking the continuity of experience even as they transform and reorganize. Motion is meaningful and appropriate, serving to focus attention and maintain continuity.
Material design frameworks
A modern responsive front-end framework based on Material Design
MaterializeCSS.com
A lightweight material design framework with no javascript dependencies.
GetMDL.io
Material Design version of Foundation Framework by Zurb.
Website
A Set of React Components that Implement Google's Material Design.
Material-UI.com
MUI is a lightweight CSS framework that follows Google's Material Design guidelines
MUICSS.com
A UI component framework and a reference implementation of Google's Material Design specification.
Website
A material design extension library for the Ionic hybrid mobile app framework.
IonicMaterial.com
A CSS-only framework inspired by material design
Website
A front-end framework based on Google Material Design.
ui.lumapps.com
Material Design for Bootstrap is a theme for Bootstrap 3 which lets you use the new Google Material Design in your favorite front-end framework.
Comments
Let us know about Material Design resources!