Flexboxle – A Daily Puzzle with Flexbox
Flexboxle – A Daily Puzzle with Flexbox
I built Flexboxle, a daily puzzle game where you use Flexbox to rearrange blocks to match a target goal state. How it works: * Your goal is to arrange a set of blocks into a specific pattern using Tailwind CSS Flexbox classes (and <divs>) * After every submission, every block is graded as perfect (green), close (yellow), or wrong (gray) * You have 6 attempts per puzzle * The game checks block positions, not your specific CSS so there can be multiple solutions that work * There is a new puzzle every day so come back tomorrow for a new challenge The trickiest part of building this game was making it playable on mobile. Highlighting sections, navigating in an editor, and adding in common HTML characters like <, >, /, and = are easy on desktop but pretty annoying to do on mobile. I eventually settled on a quick add panel with all of the controls you need so you can easily apply classes, group elements together in a div, and see all of the supported classes. Let me know if you have any feedback! Enjoy!
Share cardActual performance
Launch Intel predictions
Analyze your own launch →Correct prediction on native model
Similar products
Daily Cryptography Puzzle
Daily Cryptography Puzzle
GeneGuessr – a daily biology web puzzle
I wrote a symmetry game with a daily puzzle
Deduct the clues. Solve the puzzle
A daily word puzzle against my dad
Wordmaster – A Daily Word Puzzle
8-5 puzzle
Mimicking Scheme in Ruby by Implementing the Yin Yang Puzzle
binary variable puzzle