{tocify} $title={Table of Contents}
CSS is hard! Not anymore.
Here is the list of 6 awesome free sites to learn CSS by playing games:
1. CSS Grid garden
→ Learn CSS Grid Layout by planting trees and growing your garden with 28 different levels.
2. Flexbox Zombies
→ Flexbox Zombies is a fun game where we use Flexbox to position hero’s crossbow and hit the zombies and survive.
3. Flexbox froggy
→ Learn Flexbox by guiding the frog to the lilypad using diffent Flexbox properties you have learnt.
4. CSS Diner
CSS Dinner is a game to learn different selectors in CSS and organising them in a way to prepare a good looking meal.
5. CSS battle
→ CSS Battle is a online interactive playing platform where you can invite your friends and make use of CSS properties to build certain shapes and battle against them.
👉 CSSBattle
6. Flexbox diffense
→ In this game, we use the CSS Flexbox properties in building a strong tower and stopping enemies.
👉 Flexbox Defense
Reference:
Linkedin post from