---
title: MaterializeCSS Framework as an Alternative to Bootstrap
localeTitle: MaterializeCSS Framework como uma alternativa para o Bootstrap
---
[MaterializeCSS](http://materializecss.com/) é uma estrutura de front-end responsiva moderna baseada nos [princípios de design de material](https://www.google.com/design/spec/material-design/introduction.html) do Google.
## O que é design de material?
Material Design (codinome Quantum Paper) é um sistema de design desenvolvido pelo Google. Expandindo os motivos de "cards" que foram lançados no Google Now, o Material Design faz uso mais liberal de layouts baseados em grade, animações responsivas e transições, preenchimento e efeitos de profundidade, como iluminação e sombras.
Este [vídeo](https://www.youtube.com/watch?v=Q8TXgCzxEnw) dá uma ideia sobre o design do material:
## Confira esses sites que usam Materialize e veja a diferença do que você está acostumado!
Teste-os no seu telefone também para uma melhor sensação.
* [Os 100](https://www.100xp.io/)
* [Temas Admin](http://demo.geekslabs.com/materialize/v2.1/)
* [StrapHq](http://www.straphq.com/)
Mais exemplos [aqui](http://materializecss.com/showcase.html)
## Uma alternativa do Bootstrap, realmente?
Chill, nada pode bater Bootstrap, na minha opinião. No entanto, materializar CSS oferece apenas isso, Materialização - A sensação de interagir com a interface como se fosse um material físico, como papel. Eu acabei de chegar com isso.
Mas realmente…
Eu gosto de materializar por causa de sua simplicidade, por exemplo:
No Bootstrap você faria isso para criar um botão
```
```
Basicamente, cada nome de classe repetidamente tem o btn anexado a ele. E isso é principalmente o caso de muitos outros componentes de bootstrap, especialmente quando você quer adicionar classes simples como cor.
Com Materialize você pode adicionar todas as classes simplesmente assim:
```