Guide frogs to their lilypads by writing real CSS flexbox code.
Help Froggy and friends reach their matching lilypads by writing modern CSS layout rules. Type flexbox properties into the code editor to manipulate the positions of the frogs on screen. Progress through increasingly challenging levels that introduce key flexbox alignment and distribution concepts.
How to play
- Keyboard
- Works on phones
Click inside the game first so it gets your keys. Your progress is saved in this browser, on this game's own address.
Credits and licenses
- Made by
- Thomas Park
- Code
- MIT License
- Art and sound
- CC-BY-3.0
- Source
- github.com/thomaspark/flexboxfroggy
Created by Thomas Park, with translations by the community. Code under the MIT License; images by Thomas Park under CC BY 3.0.
Ratings and comments
No reviews yet. Anyone who plays it on AppsXi while signed in can review it a day later.
More games
Grid GardenLearning · Thomas ParkGrow your carrot garden by writing CSS grid code.
CSS DinerLearning · Luke PacholskiLearn and practice CSS selectors by serving the right dishes on the table.
QuickQWERTYLearning · Susam PalMaster touch typing on the QWERTY layout through progressive finger training exercises.
Island Not FoundAdventure · Salvatore Previti and Ben ClarkExplore a mysterious raymarched 3D island, solve environmental puzzles, and find a way to escape.
HextrisPuzzle · Logan Engstrom, Garrett Finucane, Noah Moroze, and Michael YangRotate the central hexagon to match falling colored blocks and clear lines in this fast-paced puzzle game.
Progress KnightIdle and clicker · Ihtasham42Climb career ladders, learn skills, and manage your lifespan in a medieval fantasy life-sim incremental game.