Convert design to code (Top 50 of 109)

You’ll need

Cursor desktop app installed · A project folder/codebase · GitHub CLI (for PR-generation tip)

Worth knowing

As a beginner with little coding experience, when the AI gets stuck it can be a nightmare to diagnose and you'll often need to fix code yourself.

Summarized from tutorials, including the vendor’s own

Also runs on

Mobile app

You’ll need

GitHub account (optional, for code sync)

Worth knowing

Generated apps often ship with unfinished or broken features (e.g. a non-functional gallery, an off-brand popup) that need follow-up prompts to fix, and the free plan runs out of generations quickly,

Summarized from community tutorials

You’ll need

Replit account

Worth knowing

Freshly generated features can ship with bugs (e.g. habit streak tracking didn't work) that need manual review/fixing after the build.

Summarized from community tutorials

Worth knowing

In some regions (e.g. Canada) unlocking the free tier requires claiming a location-gated reward, and the creator had to use a VPN to access it.

Summarized from tutorials, including the vendor’s own

Also runs on

Desktop app · API · Web app · Self-hosted

You’ll need

MiniMax subscription or API key · Cursor or Claude Code installed · Terminal access to run install/config commands

Worth knowing

MiniMax M3 can take 5-6x longer than faster models (e.g. ~15 min vs ~2 min) to finish the same coding task, even though output quality is often better.

Summarized from community tutorials

You’ll need

Supabase account (backend/database) · Google account (sign-in and Calendar sync) · Google Gemini API key (for AI features) · Stripe account (for payments)

Setup

about 2 min

Worth knowing

Wiring the app to real users' own Google accounts (not just the creator's) requires extra setup steps outside Lovable itself.

Summarized from tutorials, including the vendor’s own

You’ll need

GitHub or Amazon account for login · Node.js with npm or pnpm · Docker (for a Postgres database) · Git installed

Setup

about 20 min

Worth knowing

At the time of filming Kiro was waitlisted and not downloadable from its own site — one video had to fetch the installer from an unofficial third-party mirror.

Summarized from tutorials, including the vendor’s own

You’ll need

Base44 account (email signup) · Stripe account for payments (optional) · GitHub account for code export (optional)

Setup

about 5 min

Worth knowing

Vibe-coded apps can mishandle security (API keys, user data) unless you run Base44's built-in security audit and set permissions yourself.

Summarized from community tutorials

Also runs on

CLI

You’ll need

v0/Vercel account · Figma file (optional, for import) · Supabase project (for backend/database) · Node.js + Cursor (to run exported code locally)

Setup

about 7 min

Worth knowing

Generated UI isn't connected to any backend by default (no data storage) until you explicitly wire up an integration like Supabase; live preview also requires an internet connection, not a true local

Summarized from community tutorials

Also runs on

Mobile app

You’ll need

Account signup · GitHub account (optional, for code sync) · Apple developer account (for App Store publish)

Summarized from tutorials, including the vendor’s own

You’ll need

AI coding tool (Lovable, Cursor, v0, Replit, etc.) · shadcn/ui-based project

Setup

about 5 min

Worth knowing

21st.dev only supplies component code/prompts - you still need a separate AI coding tool or the shadcn CLI to actually install and render the component in a project.

Summarized from community tutorials

You’ll need

VS Code / Cursor / Windsurf IDE · Kombai account (sign up) · Existing or new code project · Figma design link (optional)

Summarized from community tutorials

You’ll need

Supabase account · OpenAI API key · Resend API key · Stripe account (for payments)

Setup

about 20 min

Summarized from tutorials, including the vendor’s own

You’ll need

Google/Gmail account (to sign in)

Worth knowing

Monetization features like in-game ads and in-app purchases were still listed as 'in development' at the time of the demo.

Summarized from community tutorials

Also runs on

Desktop app

You’ll need

A project folder on your computer or Google Drive · Basic HTML/CSS knowledge to write code

Worth knowing

The built-in live preview panel is unreliable for more complex websites, so the creator disables it and previews in a regular browser instead.

Summarized from community tutorials

Also runs on

Self-hosted

You’ll need

WordPress site (self-hosted) · Kubio account for AI credits · Domain/hosting

Summarized from tutorials, including the vendor’s own

Setup

about 2 min

Worth knowing

Past a certain complexity ('the iteration wall'), AI edits can silently break existing features (e.g. auth) - you may need to inspect or fix code yourself.

Summarized from community tutorials

You’ll need

Anything account (sign up/login)

Worth knowing

The most capable 'Max' autonomous build/test mode requires upgrading to a paid plan in some tutorials.

Summarized from community tutorials

You’ll need

Webild account (log in to weebuild.io)

Setup

about 1 min

Summarized from tutorials, including the vendor’s own

Also runs on

Web app

You’ll need

VS Code installed · Google or GitHub account for sign-up · CodeGPT account

Summarized from community tutorials

Also runs on

VS Code

You’ll need

RooCode VS Code extension (latest version) · RooCode cloud account · Open VS Code workspace to target

Summarized from community tutorials

You’ll need

Node.js/npm installed · CodeBuff account (free sign-up) · Existing code project (optional)

Worth knowing

Acts fully autonomously with no approval prompt before editing files, and credit-based usage can run roughly 2x the cost of Claude Code for comparable tasks.

Summarized from tutorials, including the vendor’s own

You’ll need

Unity Hub project (Unity open) · Bezi desktop app (Windows) · Bezi account (free tier, 100 credits) · Project synced with Bezi before prompting

Summarized from tutorials, including the vendor’s own

You’ll need

Google account · GitHub account · Existing code repository on GitHub

Worth knowing

Even after several rounds of plan-approve-test iteration with detailed prompts, Jules failed to fully fix a complex multiplayer bug in the demo, requiring repeated clarification requests.

Summarized from community tutorials

You’ll need

Google or email account · WordPress hosting (to migrate off ZipWP)

Worth knowing

On the free plan, generated sites expire after just 1 day (temporary), premium designs cost extra ($79), and permanent hosting requires a paid plan.

Summarized from tutorials, including the vendor’s own

Also runs on

VS Code

You’ll need

Existing codebase/project to work in · Terminal or supported IDE (VS Code, Cursor, Windsurf, Antigr · Amp account/access token

Summarized from community tutorials

Also runs on

Chrome extension

Summarized from tutorials, including the vendor’s own

You’ll need

Email address · Business name and description

Setup

about 5 min

Worth knowing

AI-generated pages/sections can take up to 5 minutes to build, and choosing the free plan auto-swaps premium ('Pro') stock photos for free alternatives.

Summarized from community tutorials

Also runs on

Desktop app · VS Code

You’ll need

Email or Google account for signup · Web browser

Setup

about 20 min

Worth knowing

Free-plan credits are very limited, typically enough for only one or two generated projects before needing to upgrade.

Summarized from community tutorials

Also runs on

CLI

You’ll need

VS Code installed · Kilo Code account (sign-up) · Empty project folder · Own API key (optional, e.g. OpenRouter/Anthropic)

Worth knowing

Cheaper/free bundled models (e.g. MiniMax) noticeably slow down and degrade in quality as the context window fills; starting a fresh session helps.

Summarized from tutorials, including the vendor’s own

You’ll need

Email address for signup · 512x512 PNG app icon (no transparency) · Android/iOS device to test builds

Worth knowing

Free-plan apps ship with a Mobincube splash/branding and in-app ads; a paid plan is required to remove ads and use the app commercially.

Summarized from tutorials, including the vendor’s own

You’ll need

Macaly account · external DB account for backend (e.g. Supabase/SQLite) · GitHub account for code sync (optional)

Setup

about 10 min

Worth knowing

No built-in database connector at time of filming (no one-click Supabase) — wiring a backend/database still requires developer know-how (Prisma, SQLite, etc.).

Summarized from tutorials, including the vendor’s own

You’ll need

Internet connection · Windows, Mac, or Linux OS · Account sign-up (for custom parts)

Summarized from tutorials, including the vendor’s own

You’ll need

Apple Developer account (App Store) · Google Play Developer account · GitHub account (optional, code export)

Summarized from tutorials, including the vendor’s own

Also runs on

CLI

You’ll need

VS Code · spec document (e.g. protocol PDF) · existing RTL/verification codebase · Linux server for EDA flow

Summarized from community tutorials

Also runs on

VS Code · Desktop app · API

You’ll need

Sourcegraph/Cody account signup · VS Code, JetBrains, or Cursor IDE · Cursor: mcp.json config snippet + URL · Access token for GraphQL API (optional)

Summarized from tutorials, including the vendor’s own