Vibe coding examples: 12 builds with the first prompt and what to check

Build a single-page tip and tax calculator.
Inputs: bill before tax, tax rate in percent, tip rate in percent, number of people.
Tip is calculated on the pre-tax bill.
Show: tax, tip, total, and each person's share, all rounded to cents.
If the total cannot be split evenly, show who pays the extra cent.
No login, no server, no storage. Nothing else on the page.

Build a single-page habit tracker for one habit.
A button marks today as done; I can also tick or untick any of the last 14 days.
Show the current streak (consecutive days ending today or yesterday) and the longest streak ever.
Save the data in the browser so it survives a reload. No login, no server.
A day starts at midnight in my local time, not UTC.

Build a single-page interval timer. I set work minutes and rest minutes (default 25 and 5), then press start.
Show the time left, the current phase and how many rounds are done. Play a short sound at each switch.
IMPORTANT: compute remaining time from the clock (start timestamp), not by counting ticks, so it stays correct when the tab is in the background.
No login, no server.

Build a single-page recipe scaler. I paste an ingredient list, one per line, and the original serving count, then enter a new serving count.
Multiply every amount. Show cups and spoons as fractions (1/3, 1/2, 3/4), grams as whole numbers.
Leave lines with no number ("salt, to taste") unchanged.
If scaling gives a fraction of a whole item, such as 1.5 eggs, show it as written and flag it.
No login, no server.

Build a flashcard quiz. I can add cards (front, back) and study them. Use three boxes:
- New and missed cards live in box 1; a correct answer moves a card up one box, to a maximum of box 3.
- A wrong answer sends the card back to box 1.
- Box 1 is offered every session, box 2 every second session, box 3 every fourth session.
Show how many cards are in each box. Save everything in the browser. No login, no server.

Build a single-page tool that reads a CSV file I choose from my computer with columns date, description, category, amount.
Add up amounts per category and show a net total. Spending is negative, income is positive.
Process the file in the browser only; do not upload it anywhere or call any outside service.
Show a clear message for a missing column or an amount that is not a number, and name the row.

Build a two-player Connect Four on a 7 column by 6 row board, one page, no server.
Players alternate; a click on a column drops a disc to the lowest free cell.
Detect four in a row horizontally, vertically and on both diagonals, highlight the winning discs, and stop further moves.
Detect a draw when the board is full. A full column must refuse another disc.
Add a restart button. Write the win check as a separate function I can test.

Build an RSVP page for one event with 30 places.
Guests enter name, email, attending (yes/no) and number of guests (1-4), and submit.
Store replies in a database table. The page shows only the number of places left, never other guests' names or emails.
Reject a reply that would take the total above 30, and say so plainly.
Only I, signed in as the organizer, can see the full list. Explain which database security rules you set.

Build a home inventory app. Users sign up with email and password, then add items with a name, room, purchase value and optional note.
Each user must see and change only their own items.
Show a total value per room.
Before you finish, list every table and the access rule on each, and tell me how to test that user A cannot read user B's items.

Build a small chat page for a business FAQ. I paste the FAQ text into a file in the project.
The page sends each question to a server route; that route calls the language model API with the FAQ text and returns the answer. The API key must live only on the server, never in the page code.
The model must answer only from the FAQ. If the answer is not there, it says "I don't know, please contact us" and gives the contact line from the FAQ.
Limit each question to 500 characters and add a simple rate limit per visitor.

Build a page where I upload one photo of my fridge and get three dinner ideas.
The photo goes to a server route that calls an image-capable model; the key stays on the server.
Accept only JPEG and PNG up to 5 MB. Ask the model for JSON with a list of three dishes, each with a name, the ingredients visible in the photo and up to two missing ones.
If the photo is not food, show "I can't see any food in this photo". Show the dishes as cards, never as raw JSON.

Build a Chrome extension (Manifest V3) with a toolbar button. When I click it, show a small popup with the word count and character count of the text I have selected on the current page.
Use the smallest set of permissions that works, and do not request access to all websites. Do not send any text anywhere.
After building, list every permission in the manifest and explain why it is needed, and give me the steps to load the extension unpacked for testing.