I started using Bulma several years ago. I have looked at alternatives, some have come and gone. I must say, I understand why someone would want to start their own package ... the problem, of course, is keeping up to date on technology changes (in both CSS, HTML and scripting languages), and code maintenance. I have often thought of making my own too.
Despite its quirks and limitations, Bulma remains my choice for a CSS framework. But I do not use it as is. I have my own version.
Let me explain. I occasionally hire web site developers to create pages and sites. The last thing I want to do is have to train anyone on the quirks of ANY framework. I want them to be able to use the full set of HTML tags and end up seeing a page that matches their expectations from using those HTML tags. With Bulma as is, that won't happen. Over the years, I have made some add-ons to Bulma to restore the tags back to their defaults, or "opinion-ated". An <h1> tag works as would be expected with HTML, so do ordered and unordered lists, etc.
There are also a few quirks of Bulma that I would like changed – but, that's only my preference and I would not expect the Bulma maintainers to even consider that. I'm sure they have their reasons to have quirks (or what I consider quirks) into the code.
One of those quirks is in the grid definitions. Most CSS frameworks define a vertical element as a "row" and horizontal elements as "column" or "col". For some strange reason, Bulma calls a vertical element "columns" and then uses the singular for horizontal elements ("column"). Doesn't make much sense to me, it's hard to maintain the content, especially when needing to do a search and identify all "column" elements. Do a search and you end up with both "columns" and "column". The other quirk I find detestable is the use of a Mini-Reset within the Bulma code.
I resorted to programming to fix all the issues. Now I can use either "columns" or "row" to define a vertical grid element. It's an add-on, meaning that I can still use default Bulma elements too – it will not break existing websites.
Another programming fix is to strip out the Mini-Reset and substitute "sanitize.css, forms.css, and typography.css".
I've also added a few other elements. Click any of the images to see a larger version. The image at the right shows the Bulma default look of a "title" and "subtitle" tag. Each is independent of the other. It works, but is inflexible. You can see from the HTML coding how it works.
At the right is my add-on. There is only one heading tag with the subtitle as a "span" element, within the heading tag. That means the subtitle can be conditionally formatted based on the heading tag. That strategy also allows for changing the subtitle to an "author" tag. The CSS is so simple:
h1 span,
h2 span,
h3 span,
h4 span {
display: block;
font-size: 65%;
line-height:1.5;
font-style:italic;
}
h5 span,
h6 span {
display: block;
font-size: 72%;
line-height:1.4;
font-style:italic;
}
span.author {
font-family:serif;
font-weight:400;
}
If we overlook the quirks of Bulma, it is a rapid development solution that works. With minor modifications, it not only works, but works the way I think it should.