- Too pricey to use – Most AI UI builders are super expensive, which makes them tough to afford for indie devs and small teams.
- Doesn’t play nice with your code – The UIs they generate usually don’t fit smoothly into existing projects, so you end up spending extra time fixing things.
- Annoying subscriptions – A lot of platforms lock you into subscriptions and charge even if you’re not really using them.
- BYOK (Bring Your Own Keys): Use your own API keys. Your budget, your rules.
- Use your favorite LLMs: Works with all major providers (OpenAI, Anthropic, Google, Groq, Together, etc.).
- Unstyled shadcn UI, plug-and-play: Generates clean, unstyled shadcn components you can drop right into your existing project.
- Copy & paste into prod: Generate, copy, paste—done. No overhead or lock-in.
- Live preview: See what you’re building as you go, no guessing.
This project is in a very early stage. We are actively adding and removing features, which may introduce breaking changes. Use with caution in production.
git clone https://github.com/grillsdev/grills.git
cd grills
pnpm install
cp .example.env .env
Fill the variables in .env
:
# App/auth
BETTER_AUTH_SECRET=replace_me
BETTER_AUTH_URL=http://localhost:3000
# Google OAuth (optional for login)
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
# Database
# For app/runtime libraries that read DATABASE_URL
DATABASE_URL=postgresql://grilluser:grills@localhost:5433/grills
# Drizzle uses this for local migrations (see drizzle.config.ts)
LOCAL_DB_URL=postgresql://grilluser:grills@localhost:5433/grills
# Redis (optional)
UPSTASH_REDIS_REST_URL=
UPSTASH_REDIS_REST_TOKEN=
Notes:
drizzle.config.ts
is already set to useLOCAL_DB_URL
whenprod
isfalse
. If you change that behavior, update it accordingly.- Make sure the DB is reachable at the URL above (or change both URLs to your local Postgres).
In wrangler.jsonc
, ensure hyperdrive[0].localConnectionString
matches your local DB URL:
If you use a different DB, update both LOCAL_DB_URL
in .env
and this localConnectionString
to match.
pnpm db:migrate
pnpm db:studio
Then add LLMs and Models:
- Follow the format shown in
example.llms.ts
(Notetitle
in LLM Table Field andname
in Model Table Fields) - In the LLM table: use the same
title
as in the example - In the Model table: use the same
name
is the model slug (e.g.,openai/gpt-5-mini
),title
is the public-facing name
Example reference (from example.llms.ts
):
export const llms = [
{ id: "default", title: "openai", name: "Open AI" },
{ id: "default", title: "openrouter", name: "Open Router" },
];
export const models = [
{
id: "default",
title: "Kimi K2",
name: "moonshotai/kimi-k2",
llm_id: "openrouter-primarykey",
created_at: "Select now",
},
{
id: "default",
title: "Qwen3 Coder",
name: "qwen/qwen3-coder",
llm_id: "openrouter-primarykey",
created_at: "Select now",
},
{
id: "default",
title: "GPT 5 Mini",
name: "openai/gpt-5-mini",
llm_id: "openrouter-primarykey",
created_at: "Select now",
},
{
id: "default",
title: "G 2.5 flash lite",
name: "google/gemini-2.5-flash-lite",
llm_id: "openrouter-primarykey",
created_at: "Select now",
},
];
pnpm dev
- OpenAI
- OpenRouter
- Gemini
- Claude
- Grok
- Groq
- TogetherAI
- Multiple file support
- Daytona support
- E2B support
- Reasoning Support
- Image Support
- Publish UI
- Share whole chat
- Context 7