So i decided to start working on some Material Design elements in webflow this morning…here’s where i’m at so far:
It’s been a bit of a hit & miss affair to get things looking somewhat “material-like” so i’d be grateful if for any feedback on what i’ve done so far…and anything else you think I should add! No mobile styling on this yet as i’m trying to get the basic bits & pieces together first
(The plan is to keep building elements & components over the next few weeks, so I have a library of material elements to use in future projects…)
A couple of things that might be helpful if you’re planning on getting your material design steez on in webflow:
For the waves effect on the buttons I just patched in a couple of elements from the Materialize framework (materializecss.com). It was as easy as adding a little css in the header, linking to the materialize JS file and adding a couple of classes to my buttons. 10 minute job tops (though I spent the previous 2 hours trying to code it myself!!!)
For shadows I used 2 drop shadows on each element: one set to 25% opacity with 5px of blur and one set to 16% opacity with 10px of blur. I couldn’t quite get the right effect using one!