I built a free printable coloring pages website for kids, powered by AI generation.
The Fun Part:
Almost all the code was generated by Windsurf with Claude Sonnet 4.5. This was an interesting experiment - I never thought I could actually pull this off. It's fascinating to see what's possible with AI-assisted development today.
Background:
As a parent, I noticed my kids love coloring, but most online resources are either low quality or require paid subscriptions. So I built this using AI to provide high-quality coloring pages for free to all parents.
Core Features:
- AI-generated high-quality line art (powered by Google Gemini)
- 50+ themed categories (animals, holidays, nature, etc.)
- Age-appropriate content (3-12 years) with difficulty levels
- One-click PDF download, print-ready
- Multi-language support (English, Chinese, etc.)
- User favorites and browsing history
Tech Stack:
- Next.js 16 + React 19
- Drizzle ORM + PostgreSQL
- MeiliSearch for search
- Cloudflare R2 for image storage
- Google Gemini AI for content and category generation
- Tailwind CSS + shadcn/ui
Interesting Challenges:
1. AI category consistency - Built a "memory system" to make AI reuse existing categories instead of creating duplicates
2. Image optimization - Using Next.js Image optimization with preloading strategy, LCP < 1.5s
3. SEO - Implemented structured data and multilingual sitemaps, now indexed 500+ pages on Google
Future Plans:
- Custom AI generation from user prompts (text-to-coloring-page)
- Image upload to generate coloring pages (image-to-coloring-page)
- User upload and sharing features
Feel free to try it out and share your feedback! I'd especially love to hear suggestions on technical implementation and product direction.
The source code is not open-sourced yet, but happy to discuss technical details.
I have a question on how you generated the 2D line arts. You wrote that you used Google Gemini. I’m
Interested to have more details on the prompt or the process you side it have quality line arts.
Thanks! I use Gemini's Imagen 3 API with specific prompts emphasizing "black and white line art, coloring book style, simple clean outlines, no shading".
Key is being very explicit about:
- Line art only, no shading/gradients
- Age-appropriate complexity
- Theme-specific keywords
Biggest challenge was consistency - took many iterations to dial in the prompts. I also manually filter out images with unwanted shading (working on automating this).
Happy to discuss more if you're exploring similar ideas!
Nice one, my daughter will love it. Have you thought about adding colored version done with some other ai to provide reference? my son (hes younger) prefers ones like that
Great minds think alike! I'm actually working on this feature right now - adding AI-colored reference versions alongside the line art. It should be live very soon. Thanks for the feedback, and I hope your daughter enjoys the current pages!
I built a free printable coloring pages website for kids, powered by AI generation.
The Fun Part: Almost all the code was generated by Windsurf with Claude Sonnet 4.5. This was an interesting experiment - I never thought I could actually pull this off. It's fascinating to see what's possible with AI-assisted development today.
Background: As a parent, I noticed my kids love coloring, but most online resources are either low quality or require paid subscriptions. So I built this using AI to provide high-quality coloring pages for free to all parents.
Core Features: - AI-generated high-quality line art (powered by Google Gemini) - 50+ themed categories (animals, holidays, nature, etc.) - Age-appropriate content (3-12 years) with difficulty levels - One-click PDF download, print-ready - Multi-language support (English, Chinese, etc.) - User favorites and browsing history
Tech Stack: - Next.js 16 + React 19 - Drizzle ORM + PostgreSQL - MeiliSearch for search - Cloudflare R2 for image storage - Google Gemini AI for content and category generation - Tailwind CSS + shadcn/ui
Interesting Challenges: 1. AI category consistency - Built a "memory system" to make AI reuse existing categories instead of creating duplicates 2. Image optimization - Using Next.js Image optimization with preloading strategy, LCP < 1.5s 3. SEO - Implemented structured data and multilingual sitemaps, now indexed 500+ pages on Google
Future Plans: - Custom AI generation from user prompts (text-to-coloring-page) - Image upload to generate coloring pages (image-to-coloring-page) - User upload and sharing features
Feel free to try it out and share your feedback! I'd especially love to hear suggestions on technical implementation and product direction.
The source code is not open-sourced yet, but happy to discuss technical details.
I have a question on how you generated the 2D line arts. You wrote that you used Google Gemini. I’m Interested to have more details on the prompt or the process you side it have quality line arts.
Thank you very much!
Key is being very explicit about:
- Line art only, no shading/gradients - Age-appropriate complexity - Theme-specific keywords
Biggest challenge was consistency - took many iterations to dial in the prompts. I also manually filter out images with unwanted shading (working on automating this).
Happy to discuss more if you're exploring similar ideas!