🌍 Flag Painter

🎨 Overview

Flag Painter is an interactive educational game where you learn to identify and recreate flags from around the world. Each flag is broken down into colored sections—your job is to select the right colors and fill each section correctly. Perfect for geography enthusiasts, students, or anyone who wants to learn flags in a fun, hands-on way.

🎮 How to Play

1. Select a flag from the grid
2. Pick a color from the palette
3. Tap a section of the flag to paint it
4. Fill all sections correctly to complete the flag
5. Hit Check to see if you got it right!

🏁 Features

Feature	Description
10 Flags	Japan, France, Germany, Italy, Poland, Switzerland, Sweden, Netherlands, Brazil, Colombia
Color Palette	Each flag comes with a custom palette of colors to choose from
Interactive SVG	Tap any section of the flag to fill it with your selected color
Progress Tracking	See how many flags you've completed at the top
Star Rating	Complete flags with fewer attempts for more stars ⭐
Reset Button	Start a flag over if you get stuck
Keyboard Shortcuts	Enter = Check, R = Reset, Esc/Backspace = Back to grid
Mobile Friendly	Works on touch devices with responsive design

🎯 Objectives

• Learn flags by matching colors to their correct positions
• Earn stars by completing flags with zero or minimal mistakes
• Collect all 10 flags to become a flag master!

✨ Game Mechanics

• Each flag is broken into sections (rectangles, circles, polygons)
• Correct colors are revealed after completion
• Mistakes are tracked—fewer mistakes = more stars
• Completed flags show a checkmark in the grid

🌟 Flag List

Flag	Colors
🇯🇵 Japan	White background, Red circle
🇫🇷 France	Blue, White, Red (vertical)
🇩🇪 Germany	Black, Red, Gold (horizontal)
🇮🇹 Italy	Green, White, Red (vertical)
🇵🇱 Poland	White top, Red bottom
🇨🇭 Switzerland	Red background, White cross
🇸🇪 Sweden	Blue background, Yellow cross
🇳🇱 Netherlands	Red, White, Blue (horizontal)
🇧🇷 Brazil	Green, Yellow diamond, Blue circle
🇨🇴 Colombia	Yellow, Blue, Red (horizontal)

🎮 Controls

Action	Input
Select color	Click color button
Paint section	Click/tap flag section
Check flag	Click ✅ Check button or press Enter
Reset flag	Click ↺ Reset or press R
Back to grid	Click ↩ Back or press Esc/Backspace

💡 Tips

• Study the flag's hint before you start
• Select a color first before tapping a section
• Use the Reset button if you make too many mistakes
• Try to complete flags in one attempt for 3 stars!

📱 Mobile Support

• Touch-optimized interface
• Large tap targets
• Responsive layout that adapts to any screen size
• Works on both portrait and landscape orientations

🧠 Educational Benefits

• Visual learning – Connect colors to flags
• Memory retention – Repeated practice reinforces knowledge
• Geography awareness – Learn which countries use which colors and designs
• Pattern recognition – Notice similarities and differences between flags
• Fine motor skills – Precise tapping on touch devices

🔧 Technical Details

• Pure HTML/CSS/JavaScript – No external dependencies
• SVG rendering – Smooth, scalable flag graphics
• Responsive design – Works on desktop, tablet, and mobile
• Offline ready – Runs locally without internet

📝 Credits

Made with ❤️ by [Your Name]

🔗 Links

• Play on Itch.io
• Source Code
• Report a Bug

Paint, learn, and master the flags of the world!