Flexbox Froggy

Web layout game

Write CSS to get the frogs onto their lily pads, and learn to arrange a web page along the way.

Make it mineTry it (opens the authors’ own copy in a new tab)

“Make it mine” asks you to sign in first. On the Free plan, your copy is your one app; you can delete it any time.
“Try it” opens the authors’ own copy, not yours.

Made by
thomaspark
Licence
MIT
Popularity
7.4k stars on GitHub
Uses
Just a browser

What you can do

  • Clear the levels one by one, each a new layout puzzle
  • Water a garden in a second game about grid layout
  • Switch to any of dozens of languages, Chinese included

Who it’s forStudents and beginners learning to make web pages

Once it’s yours

  • Your own copy, at its own address
  • Anyone with its address can open it, until you choose who can
  • Change it with your own coding agent

Ideas for changing it

Once it’s live, give any line below to your coding agent.

  • Make Chinese the default language

  • Add a level just for centering things

  • Put our coding club's name next to the title

Source and licence

Flexbox Froggy is open source: its authors, thomaspark, published the code for anyone to use and change.

Its licence, MIT, lets you use and change it freely, as long as you keep the authors’ copyright notice.

Your copy is the version you copied; the authors’ later updates don’t arrive by themselves.

This version on TofuThe authors’ original code

More like this

All templates