How-to use Material Design for Bootstrap (MDB) UI Kit with Pinegrow

This tutorial is now available from:

Have questions or comments about this tutorial? Let’s talk about it!


Thank you very very much for MDB!!! It’s magic!!!

Glad you find this tutorial useful! :wink:

Thanks for the nice tutorial!

Only wish they made separate CSS for every module. If you only use one block it cost you 271kb!
With the Pro version it’s even more with JavaScript etc.
I suppose there is no way to get the individual CSS an JavaScript for individual blocks?

Then I prefer the way @BenHanna has made the blocks, with individual CSS blocks that you can copy to your main CSS!


Hopefully that will be addressed soon through this upcoming discussed feature by @matjaz ?

@AllMediaLab It is possible to customize the mdb-free.scss and remove the parts you don’t want / need.

I haven’t looked at the details, but I guess it is also possible to tweak the JS file.

1 Like

Hi Emmanuel,

Thanks for pointing that out!

Would the compiling be easy in Pinegrow? I see some core SCSS stuff that I’m not sure on how to use that! Is this all needed? That’s still a lot! 133kb before compiling.

@import “core/mixins”;
// Your custom variables
@import “custom-variables”;
@import “core/colors”;
@import “core/variables”;
@import “core/global”;
@import “core/helpers”;
@import “core/typography”;
@import “core/masks”;
@import “core/waves”;



Pinegrow will compile the SASS file and will generate the CSS.

Yes I understand, but the core is so huge that you don’t gain any bandwidth by compiling only the blocks you want. Most blocks are between 2 kB and 4 kB with one exception the forms 16kB.

That’s what I don’t like about these kind of frameworks! The way @BenHanna made the extensions is that you have the individual CSS for each block, that’s much better.

If the MDB was not so bloated I would purchase the Pro version, but considering € 200,- for a framework that is based on a Bootstrap version that has come to it’s end!? :roll_eyes:

@AllMediaLab, Thats why what I referenced above remains an important part of workflows, given the abilities present. Time will tell, it doesnt seem to be something they wish to discuss or comment on much.

I think the developers of Pinegrow are open for any discussion! Have a lot of wishes too, but not everything can be done when we want it.

The point is @matjaz himself has now discribed they are working on something(?) as referenced above in his own words. But yes I understand not all things are applicable in app as you know (hopefully that service solution works for you however).