BYOAIK — Bring Your Own AI Key: a directory of AI tools that run on your own API key.

screenshot-to-code

Turns screenshots and mockups into working front-end code using the OpenAI, Anthropic or Gemini key you supply.

Website Source code

Category:
App Builders
Pricing:
Open Source
Open source:
Yes (MIT)
Self-hostable:
Yes
Local-first:
No
Platforms:
Web, Self-hosted, Docker
AI providers (bring your own key):
OpenAI, Anthropic, Google Gemini
API key storage:
User controls deployment
Key risk level:
LOW
Trust score:
88/100

screenshot-to-code converts screenshots, mockups, Figma exports and screen recordings into working front-end code across HTML with Tailwind, React, Vue, Bootstrap and Ionic. The README explains that users supply their own provider credentials either through the settings dialog in the frontend or environment variables in the backend .env file, covering OpenAI, Anthropic and Gemini, and that supplying more keys lets it pick a stronger mix of models per variant. Self-hostable through Docker or a manual frontend and backend setup. MIT licensed, 74,038 stars, pushed the day before review.

Why this trust score (88/100)

Trust measures how the tool treats your API key and how much of that has been verified. It contains no popularity signal.

  • Key Safety 21/25 — The key lives in a deployment you run yourself.
  • Request Routing 20/20 — Requests go straight from you to the AI provider. The provider endpoint is configurable, so you can point it at the provider or your own gateway.
  • Transparency 20/20 — Source is public under MIT, so anyone can check how the key is handled. Key handling was located in the published source.
  • Privacy 10/15 — Can be self-hosted, so the data path stays inside infrastructure you control.
  • Maintenance 10/10 — Actively developed — commits within the last three months.
  • Verification Confidence 7/10 — Key handling was found in the published source by BYOAIK's scanner.

What was checked

Verification tier: SOURCE_VERIFIED — derived from the evidence below, not set by hand.

  • [STRONG · SOURCE_SCAN] The user supplies their own OpenAI key: the project references its API key variable. source
  • [STRONG · SOURCE_SCAN] The user supplies their own Anthropic key: the project references its API key variable. source
  • [STRONG · SOURCE_SCAN] The user supplies their own Google Gemini key: the project references its API key variable. source
  • [STRONG · SOURCE_SCAN] Supports a local model backend, so it can run with no cloud provider key at all. source
  • [STRONG · SOURCE_SCAN] The provider endpoint is configurable, so requests can be pointed straight at the provider or at your own gateway. source
  • [CONFIRMED · SOURCE_SCAN] Ships a container definition, so it can be self-hosted on your own infrastructure. source
  • [CONFIRMED · SOURCE_SCAN] Most recent commit 2026-07-30 — about 1 month(s) ago. source

How your API key is handled

You self-host the app, so your API key lives in your own deployment. Requests are sent directly to the AI provider. Because it can be self-hosted, your key never has to touch a third-party backend.

Setup

Deploy it (Docker/compose), add your provider API key in the admin or environment config, then select models.