Bulma CSS Framework - complete tutorial

Bulma is the brainchild of CSS Guru Jeremy Thomas @jgthms. It's a modern responsive CSS framework based on Flexbox. The framework makes scaffolding and designing websites a breeze with best-in-class documentation and well-designed, intuitive components and modifiers. ✨

Bulma is great not just for building but learning best HTML and CSS3 practices, too! It's like having @jgthms👨‍🎨 there the whole time. 😍

In this course, you'll learn to create not one, not two, but three beautiful, responsive websites bootstrapped with Bulma in less than an hour.

Have a question, comment, or feedback? Feel free to reach out to the course creator Zaydek on Twitter: @username_zaydek.

--

[ryandunn]

I know this isn't the focus of the video, and others have mentioned it before me, but that little "debug.css" you threw in there was CLEAN 👌nice tutorial, Zayden!

[freecodecamp]

We're reposting this because the original had an out-of-sync section.

[pezonizquierdo]

That mouse movements is driving me crazy!

[lemonphi]

Thank you for this cool presentation - I'll use Bulma in my next project! It was partly hard to watch for the erratic resizing and mouse movements - but please give use more, this is cool technology!

[FlockofSmeagles]

Just so people know that are coming to this now. The scrimba version is interactive, and of much higher quality. Go there!

[jacobmoore]

lost me when you made your own CSS classes for the grid. I'm trying avoid working w/ CSS directly in any capacity. Everything before was super informative & helpful!

[pwnsensei]

Can somebody please stop him from abusing his mouse?

[lewiskori]

Great tutorial. very informative and covers the most important concepts of bulma. Good job mr.

[ytprodata]

This needs re-editing with the presenter speaking at 60-70% of the speed and zero unnecessary mouse movements. It's like the whole video is on speed at present

[jasperzanjani]

I never thought a mouse cursor would give me so much anxiety

[wilderolivera]

What a great tutorial! I have to say this css library is better than Bootstrap!

Can you show us how to make the navbar interactive?

[ndToLast]

Does this help you make a time machine?

[MatthewCopperwaite]

Seriously I feel sea-sick watching that mouse bounce around and flicking between screens

[danvilela]

This is great! But where can i get that debugger css?

[ratanakratanak]

Where can I get the debugger,
and docs.html?

[soarcoder]

Hi, where can I get "debug.css" that you used?

[julienbongars]

my god, could you imagine using this with react and sass?

[JusttheFactsMedia]

Need to play this video back at 50% speed to follow it.

[elbofino]

Hi, great video, i learned lot of things on Bulma and CSS etc..
But there's something i'm frustrated about : the end of 6th part on grid. Am i missing something but what's the point the create 3 columns in grid and put in it the breadcrumb nav tag. I mean..what do the 3 columns stand for ? Would it be just the same to have a fullwidth nav and chain the li items ? Sorry for my english, not my native tongue. Thanks in advance for your help :)