About

Learn about Material Design and our Project Team.

Kmaterialize is a fork of MaterializeWeb (https://materializeweb.com).

Latest improvements

· Kmaterialize 2.3.3-1.0.38 · Documentation 1.4.26

Smoother switches and form controls

Switches now follow mouse, pen, and touch drags continuously, then settle into their on or off position on release. Plain and icon switches share a visible outer halo while dragging. Keyboard controls, disabled states, right-to-left layouts, and vertical touch scrolling remain supported.

Clicking an outlined field’s label now focuses its input, including on custom backgrounds. OTP fields support left, center, and right alignment, with labels and supporting messages aligned to the code.

Clearer validation and examples

Every input guide includes validation examples for its supported constraints, such as required values, length limits, and formats. Compact error messages and icons sit close to their controls, with improved layouts for checkboxes, radio groups, file uploads, and OTP fields.

The range validation example shows the selected storage allocation in GB above the slider. Its message clears when the value meets the limit and returns when it exceeds it.

All 19 input guides now follow the same order: basic example, setup, examples and variants, validation, and reference. Working examples come first, with responsive reference tables and corrected character-counter, chip, and picker setup.

More controlled editor dragging

In the Handlebars editor, dragging a token into the template panel keeps the current scroll position. Moving toward an edge after entering the editor scrolls gently, making it easier to place a token where you intended.

The Team

Kmaterialize is a personal fork of MaterializeWeb, maintained by Kevin Zarshenas. It builds on the work of MaterializeCSS's original creators and the community that has kept it going since.

Material Design

Created and designed by Google, Material Design is a design language that combines the classic principles of successful design along with innovation and technology. Google's goal is to develop a system of design that allows for a unified user experience across all their products on any platform.

Principles

Material is the metaphor

The metaphor of material defines the relationship between space and motion. The idea is that the technology is inspired by paper and ink and is utilized to facilitate creativity and innovation. Surfaces and edges provide familiar visual cues that allow users to quickly understand the technology beyond the physical world.

Bold, graphic, intentional

Elements and components such as grids, typography, color, and imagery are not only visually pleasing, but also create a sense of hierarchy, meaning, and focus. Emphasis on different actions and components create a visual guide for users.

Motion provides meaning

Motion allows the user to draw a parallel between what they see on the screen and in real life. By providing both feedback and familiarity, this allows the user to fully immerse him or herself into unfamiliar technology. Motion contains consistency and continuity in addition to giving users additional subconscious information about objects and transformations.