Labels.io

How to start

Pick the path that matches the AI tool you want to use. Every path ends the same way: you chat, the AI edits files, you see the result in the browser.

Easiest end-to-end for non-developers. You get a visual editor, a chat panel, and the AI edits files in place. The big four AI providers all ship official VS Code extensions; pick the one you already use or want to pay for.

  1. Download VS Code: code.visualstudio.com.

  2. Open this folder: File → Open Folder → select the kit folder.

  3. From the Extensions tab, install the official extension for your AI:

    If you want to use...Install
    ClaudeClaude Code for VSCode (Anthropic, official)
    ChatGPT / CodexCodex (OpenAI, official)
    GeminiGemini Code Assist (Google, official)
    GitHub CopilotGitHub Copilot Chat (Microsoft, official)
  4. Sign in with the matching account. Follow the extension's prompts.

  5. Open the chat panel and type:

    Read CLAUDE.md and DESIGN.md, then show me what this project does.

From there, start asking for changes: "add a pricing page", "change the accent color to forest green", "add an SEO pass".

Path 2 — Standalone AI apps or AI-first IDEs

If you prefer a dedicated app over installing an extension, each provider has a standalone option. These do the same thing as the extensions in Path 1 — read, chat, edit — just as a separate application.

Provider apps

  • Claude desktop — Anthropic's native app for macOS and Windows. claude.ai/download. Drag the project folder into chat or attach it as a project.
  • ChatGPT desktop — OpenAI's native app. openai.com/chatgpt/download. On macOS, "Work with Apps" lets it read your VS Code window directly.

Google does not ship a standalone Gemini desktop app for code work. Their answer for this category is Antigravity in the IDE section below.

AI-first IDEs and standalone agents

  • Cursorcursor.com. VS Code fork. Open the folder, press Cmd+L for chat. Reads .cursor/rules/.
  • Antigravityantigravity.google. Google DeepMind's agentic coding IDE. Works with Gemini models.
  • OpenCodeopencode.ai. Open-source, terminal-first AI coding agent, model-agnostic (works with Claude, GPT, Gemini, local models). Run it inside the kit folder.

Setup is always the same: install, open this folder, start chatting. All of them read the instruction files this kit ships.

Path 3 — Terminal / CLI

For people comfortable at the command line.

  • Claude Code CLI: npm install -g @anthropic-ai/claude-code, then claude in the kit folder.
  • Gemini CLI: npm install -g @google/gemini-cli, then gemini in the kit folder.
  • Codex CLI: npm install -g @openai/codex, then codex in the kit folder.

Slash commands available where supported: /add-page, /add-pricing, /add-service, /add-blog, /add-seo.

You can open ChatGPT, Claude.ai, or Gemini in the browser and paste files in to iterate. It works, but it is slow: every change is copy into chat, paste code back into files, save. After the second or third page, switch to Path 1.

For one-off initial setup help (walking you through installing VS Code and Node), web chat is fine. See START-HERE.md for that.

Which path for you?

  • First time, easiest: Path 1 with whichever AI you are already paying for or want to try.
  • Prefer a standalone app: Path 2. Claude desktop or ChatGPT desktop if you have the subscriptions; Cursor or Antigravity if you want an AI-first IDE.
  • Terminal-comfortable: Path 3.
  • Absolutely no install: Path 4. Start there, switch later.

What to ask first

Whichever path you pick, a good first message is:

Read CLAUDE.md, DESIGN.md, and README.md. Give me a one-paragraph summary of what this project is and what changes I could make.

That warms the AI up with your conventions. Every request after that will be better.

On this page