loading...

BULMA - A CSS Only alternative for Bootstrap

pradeepn profile image Pradeep Nagendiran Originally published at Medium ・2 min read

Monotonous Bootstrap

After the usage of bootstrap in multiple projects i got monotonous with bootstrap. Particular with Bootstrap4. I lost my fun towards bootstrap and started looking for alternatives. The next famous UI framework that shine before me was Googles Material design. It looks good and inspire lot of fun but it requires lot of attentions. There is a steep learning curve in order to use the Material design. Search continues for alternatives.

Why to include Script for UI Design ?

One more thing that strikes me is the need for lot of javascripts that needs to include in order to use a UI framework. Frameworks like bootstrap, material design and other frameworks that come with a heavy js code for its interactions.

In that search for the CSS Only alternative framework that got my attention is Bulma.

Bulma - To The Rescue

Bulma is a very light weight framework with which you can able to build a whole website without the need for any additional UI library. You just need to link the CSS from CDNJs and start to build.
It size very less approximately ~190Kb. Bulma contains all the need elements like

  • Responsive Design
  • Layout Helpers
  • Grid System
  • Utility Helpers
  • Form Utilities
  • Components

If you have already used bootstrap then you can able to find all you bootstrap components available in Bulma with detailed Documentation,
Starting from

  • Hero Component
  • Themed Buttons
  • Themed Alerts
  • Cards & Modal Dialogs
  • Menus & Dropdowns
  • Tabs & Accordion
  • Breadcrumbs & Paginations
  • etc.

Off-course the interactions for tabs and accordion we have to write on our own. But with jQuery, we can achieve that in not more than a line.

Bulma enables Rapid Application Development with very less or no learning curve.

SAAS Support

If you can work on SAAS than you can build you own theme with the help of exposed 419 Variables and Mixins. With the help of Node or Webpack we can create the task of building your own themed Css.

If any one planning for a new project then you can try out Bulma. I am sure you won't regret it.

Posted on by:

pradeepn profile

Pradeep Nagendiran

@pradeepn

Microsoft Solutions/ Software Architect with 12 Years of experience in design, developing and deploying enterprise applications for various Cloud service providers specialized in .NET & .NET Core.

Discussion

pic
Editor guide