flexboxfroggy

Flexbox Froggy é um jogo educativo baseado em navegador criado por Thomas Park para ensinar o layout flexbox do CSS de forma envolvente e prática. O jogo apresenta 24 níveis progressivamente desafiadores em que os jogadores devem escrever as propriedades CSS flexbox corretas — como flex-direction, justify-content, align-items, flex-wrap, align-content, flex-flow e order — para posicionar os personagens-sapo em suas vitórias-régias correspondentes. Cada nível introduz um novo conceito de flexbox com uma breve explicação e uma prévia visual. Os jogadores digitam código CSS em um painel de edição e recebem feedback imediato conforme os sapos se movem para seus lugares. O jogo funciona inteiramente no navegador, em flexboxfroggy.com, sem necessidade de instalação. O projeto é de código aberto sob a licença MIT (código) e Creative Commons BY 3.0 (imagens). Ele foi traduzido para mais de 50 idiomas por colaboradores da comunidade, incluindo chinês (simplificado e tradicional), japonês, coreano, espanhol, francês, alemão, russo, árabe e muitos outros. As traduções são gerenciadas por meio do repositório no GitHub, onde os colaboradores podem adicionar novos idiomas por meio de pull requests. O Flexbox Froggy é amplamente citado em tutoriais de desenvolvimento frontend, bootcamps de programação e recursos de aprendizado de CSS como um ponto de entrada acessível para dominar o layout flexbox. O código-fonte é um site estático adequado para hospedagem própria ou uso offline.