I mean Bootstrap 3 looks a bit samey but I'd attribute that to being a victim of its own success.

Bootstrap 4 gives the fonts a once over, adds some extra components [1] plus some contemporary starter templates [2] [3]. All-in-all I think v4 strikes a good balance of modern and sensible design.

[1] https://v4-alpha.getbootstrap.com/components/card/#card-deck...

[2] https://v4-alpha.getbootstrap.com/examples/album/

[3] https://v4-alpha.getbootstrap.com/examples/carousel/

>It looks "old" and out of style

You mean the default theme for 3? Eh, ok, make your own. I've never used the default theme.

>browsers support a lot of cool css features which a lot of times makes these frameworks useless

BS4 integrates these technolgies? I could write all my components using flexbox from scratch, but why would I when BS4 already has them?

>Bootstrap is the jQuery of CSS

The mixins, functions, helpers and utilities?! What have you replaced them with?

"many much better frameworks" Care to share, I'm currently investigating the space :)

If you like BEM syntax, take a look at Kanbasu [0].

I especially like the spacers[1] for adding padding/margins without having to define separate CSS classes every time.

[0] http://kanbasu.liip.ch/

[1] http://kanbasu.liip.ch/02-helpers.html#spacings

>I especially like the spacers[1] for adding padding/margins

Looks just like the ones out of Bootstrap 4.

The "Embed Responsive" component appears to be a clone of BS4's.

Kanbasu's grid system looks much worse

>Widths are percentages represented by fractions. All classes are constructed like .w-{nominator}/{denominator}. By default you have halves, thirds, quarters, fifths and sixths.

>Note that only the smallest fractions are generated; for example .w-2/4 doesn’t exist when both quarters and halves are in the settings, .w-1/2 take over it.

...wait, what? Seems way more complex than Bootstrap. The responsive example is even worse:

    .grid--center>.grid__item

Yikes, appears to be BEM in naming conventions only, doesn't include the specificity flattening that makes BEM so nice. So when I want to overwrite this I need to use the > combinator?!

It also appears to be totally lacking in JS components? Also missing many of the mixins that make Bootstrap more useful.

Preferably, frameworks that are actually tested on a broad range of devices like Bootstrap is (eg. not just Chrome), and neither slow nor bloated.

Bulma or Spectre comes in mind. Even their biggest "bloated" competitor foundation is ahead.

Bulma seems much more limited in scope than BS4. Are there any JS components or Sass mixins?

>an open source CSS framework based on Flexbox and built with Sass

So, like BS4?

Spectre seems to lift most of the components directly from Boostrap, the grid system and naming conventions appear identical.

In some cases they are using some terrible practices, like the "CSS only" carousel that involves hidden radio buttons!

Thanks for recommending Bulma, looks like something I could really use over Bootstrap has some nice design qualities and components..I'm more of a backend guy myself, but looks easy enough to grep and use on some side projects I build.

thanks for this. any opinions on which one would you choose ?

give us something - I still use bootstrap :)

Bootstrap is not about looks.

What would you recommend? I'm liking the look of bulma but have yet to really give it a go