# How to Vibe Code Your Own Polarr (and Stop Paying for It) > Photo and Video AI Editors - Site: https://polarr.com - Category: Design & Photo Editing - Platforms: Web app, macOS app, Windows app, iOS app, Android app - Verdict: **Don't bother** (12/100 vibecodeable) - Estimated effort: 6+ months of expert systems engineering ## Verdict Keep paying for Polarr Pro; building a performant multi-platform RAW photo engine with client-side WASM and neural matting is a monumental systems-engineering trap. Polarr combines low-level binary image decoding (RawSpeed), C++ EXIF parsers compiled to WebAssembly, WebGL2 pixel shader pipelines, and client-side TensorFlow.js neural networks for sky/subject segmentation. An AI coding agent can scaffold a clean Next.js UI shell and basic CSS filter wrappers in hours, but it will utterly fail to write or debug custom WebAssembly memory buffers or real-time WebGL image mathematics. If you attempt this as a solo vibecoder, you will spend months fighting memory corruptions in native binary bindings and unresponsive browser tabs when processing multi-megapixel RAW files. ### What you can't replicate - The massive community creator filter marketplace - Sub-second client-side RAW decoding of proprietary camera formats across web and mobile - Optimized hardware-accelerated WebGL2 rendering pipelines that do not crash browser tabs under high-res loads ## What it does Advanced AI-powered photo and video editing software featuring custom filters, local masks, subject detection, and batch RAW processing workflows. ### Core features - Client-side WebGL2 and WebAssembly image rendering pipeline - RAW image decoding via RawSpeed port - On-device subject and sky segmentation via TensorFlow.js / ONNX - EXIF and XMP metadata parsing via Exiv2 - Custom mask tools (radial, gradient, brush, color) - Global color grading curves, HSL, and toning tools - Community filter sharing and creation marketplace ## The business ### Pricing - Polarr Free: Free — Access to basic global adjustment tools and standard filters. - Polarr Pro Subscription: $7.99/mo — Unlocks advanced tools, custom masks, and batch workflows. ### Funding $13M raised. - Seed - Series A Investors: Cota Capital, Pear VC, StartX, Threshold Ventures Founded 2014. Team size: ~23 historically. ## The hard parts - Writing or compiling performant C/C++ image math libraries (RawSpeed/Exiv2) to WebAssembly without crushing browser performance - Running heavy client-side TensorFlow.js neural network inference smoothly on multi-megapixel RAW assets without memory leaks - Maintaining absolute color parity and curve math across web, desktop, and mobile binaries - Optimizing WebGL2 shaders to handle real-time multi-layer filter lookups at 60fps ## How to vibe code Polarr ### Prerequisites - Node.js (free): Required for running the web frontend build tools and bundling assets. - GitHub (free): Source code repository and deployment trigger. ### Recommended AI tools - Claude Code: Best-in-class multi-file agentic coding tool for scaffolding the web app architecture and React UI shell. - Cursor: Ideal for inspecting image manipulation components and editing WebGL/Canvas shader code inline. ### Stack - Frontend: Next.js - Backend: Next.js API Routes - Database: Turso - Auth: better-auth - Payments: Stripe - Other: Tailwind CSS, Vercel AI SDK ### Hosting - Vercel (Hosting the Next.js web application frontend and serverless edge functions.): $0-20/mo - Cloudflare (Caching and serving static image assets and filter presets globally via R2 storage.): $0/mo ### Build guide 1. **Scaffold Web Application Shell** — Set up the Next.js framework with Tailwind CSS, TypeScript, and configure the project directory structure for a desktop-class web photo editor layout. ``` Scaffold a new Next.js 16 app with TypeScript, Tailwind CSS v4, and App Router. Create a professional dark-mode photo editor layout with a collapsible left sidebar for adjustment categories (HSL, Curves, Masks), a top toolbar for export and zoom controls, a central canvas workspace area, and a bottom filmstrip tray for thumbnail preloads. Configure better-auth for user session management with a Turso SQLite database backend. Ensure the layout uses CSS flexbox and grid to fill the viewport without native window scrollbars, mimicking a professional desktop creative application. ``` 2. **Implement HTML5 Canvas Image Rendering Pipeline** — Build the core client-side image loading and basic adjustment pipeline using HTML5 Canvas 2D and image data manipulation buffers. ``` Implement a client-side image loading and rendering pipeline using HTML5 Canvas and WebGL2 contexts inside a React component. Create an image manager state hook that loads imported JPEG or PNG files into an offscreen canvas buffer. Write shader-based or canvas pixel manipulation utility functions for basic global adjustments: Exposure, Contrast, Saturation, Highlights, Shadows, and Temperature. Implement zoom, pan, and fit-to-screen viewport matrix calculations so users can inspect high-resolution images smoothly without UI stutter. ``` 3. **Build Advanced Adjustment Panels & Curve Controls** — Construct interactive UI control widgets for tone curves, color wheels, HSL tuning sliders, and local mask definitions. ``` Build interactive React UI components for advanced photo editing adjustments. Create a Tone Curve widget with draggable control points rendering cubic spline interpolations on an SVG canvas. Create an HSL color picker panel with interactive hue ring selectors and luminance sliders for 8 distinct color channels. Implement a local mask management sidebar allowing users to add, subtract, and modify radial, gradient, and brush masks stored as alpha maps combined over the base canvas rendering layer. ``` 4. **Construct Filter Preset and Marketplace System** — Implement a preset saving mechanism and a community filter sharing store backed by Turso database tables. ``` Create a filter preset serialization system that exports all image adjustment values, curves, and mask parameters into a structured JSON schema. Build a community filter marketplace interface within the app where users can browse, preview, publish, and import custom community-made filters. Set up Turso database tables via Drizzle ORM to store filter metadata, creator profiles, download counts, and user favorites. Implement search filtering and tag categorization for the community feed. ``` 5. **Build High-Resolution Export and Polish** — Implement high-resolution image rendering, watermarking, custom batch export options, and final UI polish. ``` Implement a high-resolution export module that applies the active adjustment pipeline and filter stack to full-resolution original images using an offscreen WebGL canvas rendering pass. Add customizable export options including JPEG quality scaling, file size targets, and custom text or image watermarking overlays positioned via drag-and-drop coordinates. Polish all user interactions with keyboard shortcuts (undo/redo, zoom toggles), loading skeletons, and error handling for unsupported file formats. ``` ### Cost vs paying **Starting costs (one-time):** - Custom Domain: $12 one-time - Total: ~$12 one-time **Ongoing costs (monthly):** - Vercel Hosting & Cloudflare R2: $0-5/mo - Total: ~$5/mo - Paying for the SaaS instead: $7.99/mo - Build time: 120-160 hours (if core WASM/WebGL engines are partially stubbed) - AI tool credits: $20/mo (Claude Pro / Cursor) - Break-even: Never — building this subset without native RawSpeed/TensorFlow pipelines yields an inferior tool compared to paying $7.99/mo. ## Sources - [Polarr Official Website](https://polarr.com) - [PitchBook Profile - Polarr](https://pitchbook.com/profiles/company/109594-54) - [Apple App Store - Polarr Pro Photo Editor](https://apps.apple.com/us/app/polarr-pro-photo-editor/id1088056450)