Top 7 : Mejores frameworks gratuitos de diseño Google Material para desarrollo web (CSS & Javascript)

Top 7 : Mejores frameworks gratuitos de diseño Google Material para desarrollo web (CSS & Javascript)

7.Bootstrap Material Design (fezvrasta)

Demo | Github

Material Desing para Boostrap es un tema para Bootstrap 3 que te permite usar el nuevo diseño Material de Google en tu framework front-end favorito.

Fevrasta Material Framework

Al usar bootstrap, si eres nuevo en el diseño material, este framework es perfecto para ti.

6. MUICSS

Demo

MUI es un framework de CSS bastante ligero que sigue las directrices del diseño Material de Google. Fue diseñado desde el inicio para ser rápido, pequeño y amigable para el desarrollador. La meta del proyecto es la de proveerte con un set de componentes básicos y métodos auxiliares que cualquier desarrollador puede usar para construir sitios que son rápidos y amigables con el usuario. MUI se distingue de otros frameworks de CSS enfocandose en las siguiente características, que en nuestra opinion son las más importantes:

  • CSS-namespace (identificador mui--) para separar frameworks y markup.
  • Tamáño de cargar minúsculo.
  • No tiene dependencias.

MUICSS

5. Leaf framework

Github

Leaf Framework es un framework de CSS basado en el diseño material de Google, aunque en el sitio web oficial anuncia que está en desarrollo, este framework tiene una muy buena implementación de casi todos los componentes material listados en el diseño original de Google. Puedes descargar todas las páginas y ver como leaf funciona por ti mismo.

Leaf material design

4. Material framework

Github

Material Framework es un Framework de CSS bastante sencillo y responsivo hecho por Tim Nguyen. Este permite la integración del diseño Material en cualquier página o aplicación web.

Material framework dark

Este ofrece un montón de componentes que puedes encontrar en su sitio web oficial, e incluso un diseño oscuro está disponible.

3. Material design lite

Demo | Descargar

Material Design Lite te permite añadir el diseño material a tu sitio web. No depende de ningun framework de Javascript y se enfoca en la optimización multi-dispositivo. Las funcionalidades se desvanecen si no son soportadas en exploradores antiguos automaticamente y ofrecen una experiencia agradable e inmediata al usuario gracias a su sencilla inicialización. Los componentes de MDL son creados con CSS, Javascript y HTML. Puedes usar los componentes para construir páginas y aplicaciones web más atractivas, consistentes y funcionales.

Material design lite

2. Materialize.css

Demo

Materializecss es un moderno front-end framework basado en el diseño Material de Google. Este framework tiene animaciones CSS refinadas y transiciones para proveer una experiencia más fluida al usuario y al desarrollador.

Materialize.css

Materialize viene en 2 formas diferentes. Puedes seleccionar que version quieres dependiendo de tus preferencias y experiencias (leer la documentación es recomendable si no sabes por donde comenzar). Para comenzar a usar Materialize, todo lo que tienes que hacer es descargar la version compilada o descargar la version de desarrollo en el repositorio y compilarla por ti mismo.

1. Material Design For Bootstrap

GithubDemo

Material Design para Bootstrap ofrece cerca de 300 elementos material, 1000 iconos material, 74 animaciones CSS, clases auxiliares, plantillas, archivos SASS y mucho más. Todo está diseñado de manera responsive para ser compatible con multiples exploradores, este framework contiene las mejores caracteristicas del framework de bootstrap y el diseño material de Google. La unica desventaja, es que tienes que registrarte en el sitio web oficial para obtener una copia gratuita del framework, de otra manera tendrás que pagar con el. (puedes ver el código fuente de los ejemplo para obtener simplemente los archivos css y js de las versiones gratuitas).

Material design bootstrap

Hay multiples widgets y elementos útiles y elegantes. Es fácil de usar e implementar, además de soportar Bootstrap 3 y 4.

Si conoces otro framework CSS de diseño material, por favor compartelo con la comunidad en la caja de comentarios.

Esto podría ser de tu interes

Conviertete en un programador más sociable