Css frameworks con inspirados en Material

Css frameworks con inspirados en Material
Escrito 2 years ago

Hace ya un tiempo que Google saco una guía de como deberían ser las interfaces de las aplicaciones web. A raíz de esta información han ido apareciendo frameworks para css que imitan en la medida de lo posible dicha guía. Aquí alguno de ellos.

Materialize

materialize

Fue de los primeros en aparecer. Y quizás sea el más conocido y utilizado de todos ellos. Lleva más de un año en fase alpha, pero eso no quita para que se use en numerosas páginas web, debido a que es estable y cumple perfectamente su función.

Contiene numerosos componentes javascript para crear efectos espectaculares como parallax. Además viene escrito en sass


Material UI

Material UI

Este framework utiliza React como base para crear componentes basados en material design. Entre ellos destacar los clásicos como los modales, la barra de navegación. Y otros muy interesantes como un data-picker muy personalizable.

Aunque se recomienda usar React también existen modificaciones para Angular, Ember y Backbones


Bootstrap material

Bootstrap material

Es un tema para el clásico framework css Bootstrap. Contiene todo los elementos para este framework adaptado al diseño de material. Necesitas incluir jQuery y Bootstrap para que funcione. Si sabes utilizar Bootstrap, tan solo tienes que instalar este tema para que tu web tenga un diseño basado en material.


Material design lite

material-design-lite

Ligero y fácil de instalar es la ventaja de Material design lite. No necesitas librerías externas como jQuery, React o angular. Simplemente te le descargas y le incluyes en tu código html. También posee un sección en su sitio web que te permite seleccionar la paleta de colores y descargarte el tema css.


Polymer

Material polymer

Polymer se ha convertido en una pequeña revolución en el mundo del desarrollo web. Este framework financiado por Google, permite crear y reutilizar componentes de una manera sencilla y fácil. Dentro de su amplia gama de estos componentes existe un apartado llamado paper-elements el cual consiste en una gran cantidad de piezas como por ejemplo diálogos, inputs, barra de navegación con el estilo de material.


Material Foundation

Material Foundation

Foundation es otro framework para css que también cuenta ya con sus años. Ahora se ha renovado y ha sacado un tema con las características de material de Google.


Angular Material

Angular material

Si ya hemos visto un css framework diseñado para React y otro diseñado para Polymer. No podía faltar uno diseñado para Angular. Este framework funciona con el framework para javascript Angular y al igual que polymer paper element este framework funciona también a base de componentes fáciles de añadir.


Bonus: Material icons

Google junto con su guía para interfaces ha creado también una librería de iconos estándares para páginas webs y otras plataformas. Fáciles de instalar y utilizar, y ellos afirman que están diseñado para que encajen perfectamente con el concepto de Material. No es una colección mala, pero existen otras colecciones de iconos mayores que que la de Google.

Podéis encontrar más iconos para página web en esta entrada

Comentarios