Explicit files for a bounded CLI task

How do you build a website with Gemini CLI? Turn your chosen template into your business website by asking Gemini to edit it.

Use an existing website project as the input. Check your authentication route and local file context, request one edit and review the saved files and page before continuing.

Check my Gemini CLI setup Prepare the explicit file request

Clearstead

Veyra

Velora

Sample designs · replace the fictional content with your own.

01 / Sign-in route

Which account setup do I need?

For most individual users, Google recommends signing in to Gemini CLI with a personal Google account. API-key and Vertex AI paths are also available; organisation accounts can have different setup requirements. Choose the route for your account and check its current limits and billing separately from the template.

Your Google environment

Personal and organization accounts may have different setup conditions.

Separate usage

The template does not include Google AI access or unlimited free use.

Gemini CLI · Authentication ↗

AI ChatWorkflow example

Gemini CLI · Website project folder

You

Read index.html, RECREATE.md and the assets in this folder. Tell me where the headline, images and contact links are before editing.

AI · example response

I will inspect the files and list the sections, image paths and links. I will also identify any form that only demonstrates an action.

You

Use the existing HTML. My business copy and images are in the materials folder.

AI · example response

I will match those materials to the existing sections and ask about missing content rather than invent it.

Steps to take

Open the folder
Unzip the project and give the agent access to it.
Inspect the page
Read the HTML and instructions before replacing content.
Add your materials
Supply your copy, images and actual contact destination.

Result to aim for: the agent works on your actual website files.

Illustrative workflow. No live AI connection.

02 / File visibility

How do I provide the right context?

Open Gemini CLI in the unzipped website folder. Point it to index.html and RECREATE.md and ask it to describe the files it can read. Add your business copy and image paths so it can change the actual project, rather than work from a vague description.

Website files + design instructions

@index.html

Ask for an inspection of the actual supplied frontend before editing.

@RECREATE.md

Provide the original design specification and a separate approved business brief.

See the source files and technical details

The actual project files

14-clearstead · Current inspected ZIP

Current product download inspected on 2 October 2026. Files and remote resources belong to this named project; other templates differ.

index.html
RECREATE.md
assets/dashboard.svg
assets/envelopes.svg
assets/forecast.svg
assets/payment-route.svg

What the original instructions specify

14-clearstead/RECREATE.md · L5

The guide describes the original fictional page. Keep its role separate from the changes you want for your own business.

Produce one `index.html`, containing all page markup, an inline stylesheet and one inline vanilla-JavaScript IIFE placed after the dialog. Use English. No framework, package manager, build step, bundler, external JavaScript, backend or persisted state. The runtime is **network**: four external SVG images and the Google Fonts stylesheet/font files are required. Opening the HTML directly or serving it over a local HTTP server must support the same local interactions. Target current desktop and mobile Chromium with native `<dialog>`, `<details>`, CSS Grid, `min()`, `100svh` and `matchMedia().addEventListener()` support. Preserve every text, image URL, selector, dimension and behavior below. Keep the literal curly punctuation, en dashes and arrow glyphs.

03 / First edit

How do I request a bounded change?

Tell Gemini the exact result you want in the existing page: your company name, supplied headline, service copy and real button links. Specify the parts to preserve and ask it to save the edited HTML. Then open the preview and request any needed correction.

AI editing exampleFormwell

You

Adapt Formwell for the fictional Alder brand studio. Change the name, hero headline and introduction. Keep the layout and sample project artwork.

AI · example response

The prepared preview replaces the company name, hero headline and introduction. Compare the Content and Original tabs to see those edits; the other project images remain sample content.

index.html · RECREATE.md

Formwell · prepared HTML preview

Open full preview ↗

Prepared conversation and project versions. No live AI connection.

Prepare an explicit Gemini file request

Your own working plan

AI ChatWorkflow example

Gemini CLI · Review the edited page

You

Compare the edited page with my instructions. Check the headline, image paths, navigation and contact button at desktop and phone widths.

AI · example response

I will list any differences and check what the browser actually displays. A saved file alone does not confirm the visible result.

You

The headline is cut off on my phone. Fix that without changing the copy.

AI · example response

I will adjust the responsive layout and check the same phone width again. You can then approve the result.

Steps to take

Compare the changes
Check your supplied text, images and requested scope.
Open the preview
Check desktop and mobile; click navigation and contact.
Describe the issue
Tell the agent what is wrong and ask it to recheck the corrected view.

Result to aim for: a reviewed version you can continue editing or publish.

Illustrative workflow. No live AI connection.

04 / Files and browser

What proves the requested page changed?

Inspect the saved diff and the actual browser page. Check approved text, real links, resource requests and mobile layout. Keep original and reviewed versions separate.

01
Review changed paths

Look for unexpected edits and files that did not receive the requested change.
02
Review the visible output

Test headings, navigation, keyboard focus and the destination of the main action.

See the source files and technical details

A small change you can inspect

14-clearstead/index.html · L46

These excerpts come from the inspected English original. The following examples are prepared source edits, not a live AI session. Sample businesses and work remain fictional.

Before
<h1 id="hero-title">Give your money a little more direction.</h1>

First prepared edit
<h1 id="hero-title">Give each plan a clear next step.</h1>

Follow-up prepared edit
<h1 id="hero-title">Plan the month.<br>Choose the next step.</h1>

Original project · Clearstead 14

These excerpts come from the inspected English original. The following examples are prepared source edits, not a live AI session. Sample businesses and work remain fictional.

Open full preview ↗

Prepared source edit

This prepared version changes selected text or visuals in the same project. Its existing structure and sample content remain. Compare the files before applying a similar change to your business.

Open full preview ↗

AI ChatWorkflow example

Gemini CLI · Find the missing project file

You

This image is missing in the preview. Check the image URL and local file path in index.html.

AI · example response

I will compare the HTML reference with the actual files and check whether it uses a remote URL. If the file is missing, I will ask for it rather than substitute an unrelated image.

You

The correct image is in assets. Fix the reference, keep its filename and check the crop on mobile.

Steps to take

Check the reference
Read the image path in the actual HTML.
Find the asset
Compare local files or confirm the remote URL loads.
Reopen the preview
Check the corrected image and crop in the browser.

Result to aim for: the intended image loads from the correct path.

Illustrative workflow. No live AI connection.

05 / Correction and access

What if the output or file context is wrong?

If Gemini cannot read a file, confirm that you opened the correct project folder and that the file path exists and is allowed. If the page looks wrong, send the affected section or a screenshot and ask it to fix that specific issue. Keep a saved version for restoring rejected changes.

Can I treat ignored files as universally inaccessible?

A path in .geminiignore is excluded by tools that respect that file, including explicit @ file sharing. It is not a universal access boundary for every tool or service. If a website file is excluded by mistake, check the pattern and restart Gemini CLI after changing it.

How do I recover a rejected edit?

Keep an independent baseline and reviewed versions. Restore through your actual version-history method and recheck files and page.

Gemini CLI · Ignoring files ↗

06 / Choose the project

Which frontend fits my website task?

Clearstead presents a cash-flow workspace concept, not operating finance software. Compare it with other structures and supply only real business claims and examples.

Clearstead

A fictional cash-flow workspace frontend with a local email-form specimen; no finance account or enquiry service is connected.

See price and files ↗

Inspect the files

Current download inspected on 2 October 2026. Confirm the selected files on the product page.

index.html
RECREATE.md
assets/dashboard.svg
assets/envelopes.svg
assets/forecast.svg
assets/payment-route.svg

Some resources may load from external URLs. Review the selected project before publishing.

Veyra

Present a voice-product story, examples and workflows. It does not include a voice-to-text application.

See price and files ↗

Inspect the files

Current download inspected on 2 October 2026. Confirm the selected files on the product page.

index.html
RECREATE.md

Some resources may load from external URLs. Review the selected project before publishing.

Velora

Present a developer-tool workflow. Code-review views illustrate the concept rather than provide a live review service.

See price and files ↗

Inspect the files

Current download inspected on 2 October 2026. Confirm the selected files on the product page.

index.html
RECREATE.md

Some resources may load from external URLs. Review the selected project before publishing.

Draftwell

Present a creative workspace, its process and team. Sample project-review controls stay local.

See price and files ↗

Inspect the files

Current download inspected on 2 October 2026. Confirm the selected files on the product page.

index.html
RECREATE.md
assets/paper-detail.webp
assets/print-project.webp
assets/studio-review.webp

Some resources may load from external URLs. Review the selected project before publishing.

Sample designs · replace the fictional content with your own.

AI ChatWorkflow example

Gemini CLI · Cloudflare Pages · from folder to online

You

My website is finished. Publish this project folder to Cloudflare Pages with Wrangler. Tell me what account access and permission you need first.

AI · example response

I will check the site files and image paths. You will need to sign in to your Cloudflare account and approve creating or updating the Pages project before I upload.

You

I approve publishing to a new Pages project. Keep my current domain unchanged until I have checked the preview.

AI · example response

After the authorized upload, I will return the address Cloudflare provides and check images and links there. We can connect your domain after you approve the preview.

Steps to take

Give the agent your project
Use a file-capable AI agent with terminal access and keep index.html and assets together.
Authorize the upload
Sign in to the host and approve the specific project. The agent can run its supported CLI or API.
Check the real address
Open the returned URL; connect the custom domain only after checking the website.

Result to aim for: your website at a public address, then under your own domain.

Illustrative workflow. No live AI connection.

07 / Remaining tasks

What does this file workflow leave separate?

After editing, connect any real enquiry or booking service and ask your AI agent to publish the folder to a suitable host. Approve the account access and upload, check the returned public URL and then connect your domain. Hosting and AI access are separate from the template.

Choose website designs for Gemini CLI Publish the reviewed files Plan live form and app functions

Try the actual Formwell files

Formwell / Website files + design instructions

Try one real template before choosing.

Download the original Formwell project. Give its files and RECREATE.md to a suitable AI tool, try a small change and inspect the result.

The free sample is Formwell. Its original design and guide are in English. Product prices stay unchanged.

Download Formwell ZIP Download RECREATE.md ↗

Choose a template. Make it your website with Gemini CLI.

Download the files, open the project in your AI tool and describe your business changes. You start from an existing design and can keep editing the saved website.

Choose my starting template