Lumina Code Frame

Lumina Code Frame

Integrate a beautiful Code preview on your website.

2 followers

Beautiful, intelligent code presentation for React. Lumina Code Frame transforms code blocks into stunning, shareable windows with AI-powered explanations, syntax highlighting for different languages, and Gemini integration. Install via npm.
Lumina Code Frame gallery image
Lumina Code Frame gallery image
Free
Launch Team / Built With
Webflow | AI site builder
Webflow | AI site builder
Start fast. Build right.
Promoted

What do you think? …

Shagun Mistry
Maker
📌
Hey ProductHunt! 👋 I'm Shagun, and I just launched Lumina Code Frame: a React component that makes code blocks actually beautiful AND functional. The problem: Every time I needed to display code in an app or docs, I had to write components from scratch and also implement custom functionality. The solution: Lumina gives you gorgeous gradient themes (my personal favorite is "neon" 💜) + AI-powered feature(s). More features coming soon. Users can hover over code to refactor it, add types, fix bugs, or get explanations. All powered by Google Gemini. What makes it different: - Glass-morphic design that doesn't look like every other code block - AI actions that actually make sense (not just gimmicks) - Full TypeScript support - Takes 2 minutes to set up Would love to hear what you think! Already have ideas for v2 (custom themes, more AI models, collaborative editing), but wanted to ship something people could actually use today. Try the live demo and let me know if you find any bugs or have feature requests. Happy to answer any questions! 🙏