OpenKombai cover image

OpenKombai

Tags
Open SourceAITooling
Tech Stack

Backend, Frontend, AI Engine, Icons, Deployment

Overview

Local-first alternative to Kombai. AI-powered UI generation without data leaks.

The Problem

Designers and developers often struggle with the 'handoff' gap—converting Figma designs into clean, usable code is time-consuming and error-prone. Existing AI tools often require sending proprietary designs to the cloud, raising security and privacy concerns. OpenKombai solves this by providing a local-first, privacy-focused engine that generates high-quality React/Tailwind code directly on your machine, ensuring your IP never leaves your device while speeding up the development workflow.

What I Did

  • Built a local-first, privacy-focused alternative to Kombai that converts UI screenshots into production-ready code
  • Designed and implemented a full-stack monorepo architecture with a Python backend and React frontend
  • Created a Studio UI with drag-and-drop functionality to upload screenshots and preview generated code in real-time
  • Integrated two local LLMs (Llama 3.2 Vision for image understanding, Qwen 2.5 Coder for code generation) via Ollama
  • Shipped a working demo to Vercel and open-sourced the project on GitHub

Tech Stack Details

Backend
Python, FastAPI, Pillow, Ollama
Frontend
React, Vite, Shadcn UI, Tailwind CSS
AI Engine
Llama 3.2 Vision, Qwen 2.5 Coder (via Ollama)
Icons
Lucide React
Deployment
Vercel

Key Learnings

Local LLM Integration

Learned how to orchestrate multiple local models (vision + code) via Ollama, managing context windows and prompt engineering for multi-step AI pipelines

Full-Stack Architecture

Designed a clean separation between FastAPI backend (AI orchestration, image processing) and React frontend (UI/UX, state management)

Privacy-First Design

Understood the value proposition of keeping user data on-device—no API keys, no cloud costs, no data leakage

Image-to-Code Pipelines

Explored how vision models extract UI structure from screenshots and how code models translate that into React + Tailwind output

Open Source Best Practices

Structured the project for contributors with clear README, modular codebase, and easy local setup