Material Shadows with Inkscape!

Are you into Material Design these days? Are you fighting to inherit all the technical spec defined by Google and trying to create a mock up of your app in Inkscape?? If ‘YES’, you’re one of us and we’re ready to help you out.

In Material Design you can easily follow the Google Material Design Guidelines and start creating your mockup or wireframes using Inkscape. One issue that might bother you is the shadows used in many design elements and material design concepts. Though there is a detailed document What is material?– Elevation and Shadows in Google, yet creating everything pixel perfect might be a problem using Inkscape. Even designing a good wallpaper using Material Design would also require ‘ Material Shadows’. There are almost five different shadows with different z-depth for use.

Here is a collection of the shadows used in different Material Design objects, especially for Inkscape users.

Click here to download the SVG.

How to use:
1. Create your object
2. Drag and drop this SVG into your document
3. Delete the imported objects
4. Select your object
5. Open the Filters > Filter Editor menu
6. Click the checkbox on the z-depth you need to use.
Keep in mind that Inkscape only allows blurs to extend up to 10% of the object’s size before being cut off. To get around this, group your object with an invisible rectangle as big as the shadow needs to be, then apply the filter to the whole group.

ENJOY!!