Sobre el proyecto

Flexbox Froggy es un juego educativo basado en navegador creado por Thomas Park para enseñar el diseño CSS flexbox de manera atractiva y práctica. El juego presenta 24 niveles de dificultad progresiva donde los jugadores deben escribir propiedades CSS flexbox correctas — como flex-direction, justify-content, align-items, flex-wrap, align-content, flex-flow y order — para posicionar personajes de rana en sus hojas de lirio correspondientes. Cada nivel introduce un nuevo concepto de flexbox con una breve explicación y una vista previa visual. Los jugadores escriben código CSS en un panel de edición y ven retroalimentación inmediata mientras las ranas se mueven a su lugar. El juego se ejecuta completamente en el navegador en flexboxfroggy.com sin necesidad de instalación. El proyecto es de código abierto bajo la licencia MIT (código) y Creative Commons BY 3.0 (imágenes). Ha sido traducido a más de 50 idiomas por contribuyentes de la comunidad, incluyendo chino (simplificado y tradicional), japonés, coreano, español, francés, alemán, ruso, árabe y muchos otros. Las traducciones se gestionan a través del repositorio de GitHub, donde los contribuyentes pueden añadir nuevos idiomas mediante solicitudes de extracción. Flexbox Froggy es ampliamente referenciado en tutoriales de desarrollo frontend, bootcamps de programación y recursos de aprendizaje de CSS como un punto de entrada accesible para dominar el diseño flexbox. El código fuente es un sitio estático adecuado para autoalojamiento o uso sin conexión.