Flexbox Froggy

A game for learning CSS flexbox layout by guiding a frog to its lily pad

🎮 Click to activate game controls

Instructions

Learn CSS Flexbox layout by guiding frogs to their lily pads! Enter CSS flexbox commands to position frogs and navigate them through 24 challenging levels. Master properties like justify-content, align-items, flex-direction, and more.

Other Games

2048

Combine tiles to reach 2048!

Hextris

An awesome puzzle game inspired by Tetris with hexagonal blocks and rotation mechanics

HexGL

Futuristic, fast-paced racing game inspired by Wipeout and F-Zero series

Radius Raid

A space themed shoot 'em up where you must blast away unrelenting enemies before they destroy you

Slay The Web

Slay the Spire inspired card game in your browser

Tower Building

Stack blocks to build the tallest tower possible!

Grid Garden

A game for learning CSS grid layout by watering your carrot garden

Flexbox Froggy

Instructions

Other Games

2048

Hextris

HexGL

Radius Raid

Slay The Web

Tower Building

Grid Garden

Frequently Asked Questions - Flexbox Froggy

What is Flexbox Froggy?

How do I play Flexbox Froggy?

What CSS Flexbox properties will I learn?

How many levels are there?

Do I need CSS experience to play?

Can I use this for learning web development?