SOMYA NAYAK
15 Claude Artifacts to Build This Weekend ⚡
<- Back to Resources
PROMPTS

15 Claude Artifacts to Build This Weekend ⚡

Fifteen interactive tools you can build with ONE prompt each. No code. No subscriptions. No app downloads. A points and rewards tracker, a cash-flow calendar.

AEO SUMMARY Quick Overview & Execution Blueprint

What's a Claude Artifact? An interactive HTML page Claude builds inside the chat. It can have buttons, forms, charts, and saves your data locally on your device. You're not building "an app" — you're getting Claude to build one for you in 30 seconds, then using it forever.

HOW TO USE EACH PROMPT
Open claude.ai. Paste the prompt. Claude builds the artifact. Click "Open in browser" or interact with it inside the chat. Then publish it: hit Share, then Publish. You get a link you can open any time or pin to your phone. Publishing is also what lets your tool remember your data between visits. Before you publish, anything you type disappears when you close the tab, and Claude will not warn you. It needs a paid Claude plan, and it is the step most people miss.
PRO MOVE
After Claude builds the artifact, you can iterate in the same chat: "make the buttons bigger," "add a dark mode toggle," "add a column for [X]." The artifact updates live. Treat the prompt below as the starting blueprint — customize it as you go.
SECTION

Points & Rewards Command Center

Build time: 5 minCheck monthly

Every airline mile, hotel point, and credit card reward in one place, with a rough cash value next to each one. No more logging into six sites to remember what you have. The real win is the expiration dates: points quietly die if you don't use them in time, and this flags the ones running out before they vanish.

PROMPT / WORKFLOW CODE
Build me a Points & Rewards Command Center as an interactive HTML artifact. Keep it to one file. Do not call any outside websites or APIs.WHAT IT TRACKSEach program is one row:
   - Program name
   - Type: airline / hotel / credit card / other
   - Points balance
   - What one point is roughly worth, in cents
   - Estimated cash value (calculate this for me automatically from balance and value per point)
   - Expiration date
   - Optional noteTHE TOP OF THE PAGEThree summary cards across the top:
1. Total cash value of everything I hold
2. How much value expires in the next 90 days
3. How many programs I'm tracking

Under those, one plain sentence telling me what expires soonest and how many days I have left.THE LISTEvery program underneath. Let me add rows, edit any cell by clicking it, and delete rows with a confirm step. Sort by soonest expiration by default, and let me click any column heading to sort by that instead. Add a search box that filters by name, and filter buttons for type.THE PART THAT MATTERS MOSTColor the expiration date by urgency: red under 30 days, amber under 90 days, normal after that. Give any row expiring within 90 days a colored left edge so I catch it while scrolling. If nothing is expiring soon, say that in plain words instead of leaving an empty space.SAVING MY DATAImportant: Claude artifacts cannot use localStorage or sessionStorage. Do not use them. Use the artifact persistent storage API on window.storage to save and load my data, and load it once when the tool opens. Wrap every storage call so that if storage isn't available the tool still runs perfectly from memory and never crashes or shows an error.START ME OFFPreload three realistic example programs so I can see it working the second it opens, plus a clearly labeled button that wipes the examples when I'm ready to add my own.DESIGN- Warm and calm, not corporate. Accent color: red (#d02e2e).
- Generous spacing, large readable text, big tap targets.
- Mobile responsive. Reserve red and amber for the expiration warnings only, so they actually stand out.NICE-TO-HAVES- Export-to-CSV button so my data is never trapped
- A column for each card's annual fee, so I can see which cards are earning their keep
SECTION

Cash-Flow Calendar

Build time: 5 minCheck weekly

Your bills and your paydays on one calendar, with your balance running forward day by day. It's the cure for the "wait, why did I overdraft" panic: it tells you your tightest day of the month before you get there, instead of after.

PROMPT / WORKFLOW CODE
Build me a Cash-Flow Calendar as an interactive HTML artifact. Keep it to one file. Do not call any outside websites or APIs.WHAT I PUT INFirst my current account balance and today's date. Then entries. Each entry has:
   - Name
   - Amount
   - Money coming in, or money going out
   - The day of the month it lands
   - Repeats every month, or happens once

Let me add, edit, and delete entries, with a confirm step on delete.THE CALENDARA real month grid with days of the week across the top. Each entry sits on its day. Money in is green, money out is red. If a day has several things on it, stack them and show that day's net change. Let me click any day to see everything on it. Let me move forward and back between months, with a button that jumps back to this month.THE RUNNING BALANCEThis is the whole point, so get it right. Start from my current balance and walk forward day by day, adding income and subtracting bills in date order, and show what my balance will be on every single day. Draw it as a simple line under the calendar so I can see the shape of my month.THE MOMENT THAT MATTERSFind the lowest my balance drops during the month. Mark that day on both the calendar and the line, and put a plain sentence at the top like: "Your tightest day is the 26th, when you'll be down to $240." If the balance ever goes below zero, make that unmissable and tell me which day and by how much.SAVING MY DATAImportant: Claude artifacts cannot use localStorage or sessionStorage. Do not use them. Use the artifact persistent storage API on window.storage to save and load my entries, and load them once when the tool opens. Wrap every storage call so that if storage isn't available the tool still runs perfectly from memory and never crashes.START ME OFFPreload a realistic example month with two paydays and about six normal bills like rent, phone, and groceries, so I can see it working immediately. Give me a clearly labeled button to clear the examples.DESIGN- Calm and reassuring. This is money and it's stressful. Accent color: red (#d02e2e).
- Big readable numbers, generous spacing, mobile responsive.
- Never make me feel bad. State the facts plainly and let me plan.NICE-TO-HAVES- Let me set a cushion amount I never want to go under, and warn me on any day the projected balance falls below it
- A line showing how much room I have on my tightest day, so I know exactly what to leave in the account
SECTION

Stay-In-Touch Tracker

Build time: 5 minWeekly nudge

This is the personal one, for the people you actually love. It works out who you're overdue with and tells you who to text today. You add someone, put in the last time you talked, and realize it's been four months.

Want the work version instead? Build 6 below is the professional CRM, for contacts, companies, and follow-ups. Build this one for your people, that one for your career.

PROMPT / WORKFLOW CODE
Build me a Stay-In-Touch Tracker as an interactive HTML artifact. This is for my personal life, not work. Keep it to one file. Do not call any outside websites or APIs.WHO I ADDEach person has:
   - Name
   - How I know them: family / close friend / friend / mentor
   - The date I last actually talked to them
   - How often I want to be in touch: weekly / monthly / every 3 months / twice a year
   - Birthday
   - A running notes box

Let me add, edit, and delete people, with a confirm step on delete.THE ONE THING I OPEN THIS FORAt the very top, before anything else, tell me who to reach out to today. Work out from the last-contact date and the rhythm I picked how overdue each person is, then show the three most overdue as cards with their name, how long it's been in plain words like "4 months ago," and a button that says I reached out. Tapping it sets today as the last contact date and moves them off the list. If I'm caught up with everyone, say something warm instead of showing an empty box.THE FULL LISTEveryone underneath, sorted by most overdue first. Show name, how I know them, when we last talked in plain words, and a small colored dot: green if we're on track, amber if they're coming due, red if overdue. Let me search by name and filter by how I know them.BIRTHDAYSA section listing every birthday in the next 30 days, soonest first, with how many days away each one is. If there are none, hide the section entirely rather than showing an empty heading.THE NOTESEach person's notes box is for what we last talked about, so I can pick up where we left off instead of starting cold. Show the most recent note right on their row so I see it before I reach out.SAVING MY DATAImportant: Claude artifacts cannot use localStorage or sessionStorage. Do not use them. Use the artifact persistent storage API on window.storage to save and load everyone, and load once when the tool opens. Wrap every storage call so that if storage isn't available the tool still runs perfectly from memory and never crashes.START ME OFFPreload four example people at different stages, including one who is badly overdue and one with a birthday coming up, so I can see exactly how it works. Give me a clearly labeled button to clear the examples.DESIGN- Warm and personal, like a notebook, not a sales tool. Accent color: red (#d02e2e).
- Never use the words leads, pipeline, prospects, or contacts. These are people.
- Soft colors, plenty of room, easy to read, mobile responsive.NICE-TO-HAVES- Export-to-CSV button so my list is never trapped
- A place to note how they like to be reached, so I don't text someone who only ever picks up the phone
SECTION

Job Hunt Command Center

Build time: 5 minDaily during a search

Every application in one place: the company, the role, the pay range, who you talked to, and what's next. It opens with the follow-ups you've let slip, which is the thing that quietly costs people offers.

PROMPT / WORKFLOW CODE
Build me a Job Hunt Command Center as an interactive HTML artifact. Keep it to one file. Do not call any outside websites or APIs.WHAT I TRACKEach application has:
   - Company
   - Role
   - Link to the posting
   - Salary range
   - Date I applied
   - Stage: saved / applied / phone screen / interviewing / final round / offer / closed
   - The person I've been talking to
   - Follow-up date
   - Notes box

Let me add, edit, and delete applications, with a confirm step on delete.THE TOP OF THE PAGEA row of counts: how many are live right now, how many are at interview stage or beyond, how many offers, how many closed. Next to that, one plain sentence telling me what needs doing today, like "3 follow-ups are overdue."WHAT NEEDS ME TODAYBefore the full list, a short section of anything slipping: applications where the follow-up date has passed, and anything sitting at "applied" for more than 14 days with no movement. Each one gets a button to mark it followed up, which pushes the follow-up date out a week. This is the section that stops things falling through the cracks, so put it where I can't miss it.THE FULL LISTEverything else underneath, grouped by stage so I can see my funnel, or as a flat list sorted by whichever column I click. Color the stages so I can scan without reading. Let me search by company or role, and filter by stage.THE NOTESEach application has a notes box for the questions I got asked, names I should remember, and what to prepare next. Keep everything about one company in one place so I'm never digging through email before a call.SAVING MY DATAImportant: Claude artifacts cannot use localStorage or sessionStorage. Do not use them. Use the artifact persistent storage API on window.storage to save and load my applications, and load once when the tool opens. Wrap every storage call so that if storage isn't available the tool still runs perfectly from memory and never crashes.START ME OFFPreload five example applications spread across different stages, including one overdue follow-up, so I can see how it works immediately. Give me a clearly labeled button to clear the examples.DESIGN- Calm and encouraging. Job hunting is stressful and this should lower the temperature, not raise it. Accent color: red (#d02e2e).
- Plenty of white space, clear buttons, mobile responsive, since I'll check it everywhere.
- Don't use alarming red for rejections. A closed door is just information.NICE-TO-HAVES- Export-to-CSV button so my search is never trapped
- A simple count of how many applications it took to reach each stage, so I can see my real conversion rate
SECTION

Net Worth Tracker

Build time: 5 minCheck monthly

Everything you own minus everything you owe, turned into one number. Save a snapshot each month and it charts the line. Watching that number move, even a little, is the part that keeps you doing it.

PROMPT / WORKFLOW CODE
Build me a Net Worth Tracker as an interactive HTML artifact. Keep it to one file. Do not call any outside websites or APIs.WHAT I PUT INTwo lists on one page.
   - Assets: name, category (cash / savings / investments / retirement / property / other), amount
   - Debts: name, category (credit card / student loan / car / mortgage / other), amount

Let me add, edit, and delete items in both, with a confirm step on delete.THE NUMBERAt the top, big and unmissable: my net worth, which is all assets minus all debts. Under it, two smaller numbers, total assets and total debts. Format with commas and no long decimals so it's readable at a glance.THE PART THAT KEEPS ME COMING BACKA button that saves a snapshot of today's number. Keep a list of every snapshot with its date, and draw a simple line chart of my net worth over time. Under the big number, show the change since my last snapshot as a clear plus or minus with both the amount and the percentage, green if up and red if down, plus how long it's been since I last checked. Once I have three or more snapshots, add one plain sentence about the trend, like "up $4,200 over the last 3 months." Don't show the chart until I have at least two snapshots. Show an encouraging line instead.THE BREAKDOWNA simple visual showing what my assets are made of by category, and the same for my debts, so I can see whether I'm concentrated in one place.SAVING MY DATAImportant: Claude artifacts cannot use localStorage or sessionStorage. Do not use them. Use the artifact persistent storage API on window.storage to save and load both my items and my full snapshot history, and load once when the tool opens. The snapshot history matters most, so make sure it's never lost. Wrap every storage call so that if storage isn't available the tool still runs perfectly from memory and never crashes.START ME OFFPreload a realistic example with a handful of assets and debts, plus three past snapshots a month apart so the chart has something in it and I can see the whole thing working. Give me a clearly labeled button to clear the examples.DESIGN- Calm and private. This is a sensitive number. It should feel like a quiet notebook, not a bank app shouting at me. Accent color: red (#d02e2e).
- Big clear type, generous spacing, no clutter, mobile responsive.
- Never judge the number or tell me whether it's good. Just show it accurately.NICE-TO-HAVES- Export my items and full snapshot history to CSV so my history is never trapped
- Let me add a one-line note to each snapshot, so I remember what happened that month
SECTION

Personal CRM

Build time: 5 minDaily use

Track every important person in your life or work — last touchpoint, follow-up date, relationship strength, recent context. Nudges you when it's been too long. Replaces an $80/month CRM with one prompt.

PROMPT / WORKFLOW CODE
Build me a Personal CRM as an interactive HTML artifact.STRUCTUREA single-page app with these sections, top to bottom:

1.HEADER— "My CRM" title + total contact count + count of "needs follow-up this week"

2.QUICK ACTIONSbar with buttons:
   - "+ Add Contact" (opens a form modal)
   - "Filter: All / Close / Warm / Cold / Needs Follow-up"
   - "Sort: Last touchpoint / Follow-up date / Name"

3.CONTACT CARDSgrid (3 columns on desktop, 1 on mobile):
   For each contact:
   - Name (large, bold)
   - Role + Company
   - Relationship strength: 🟢 Close / 🟡 Warm / 🔵 Cold (color-coded card border)
   - Last touchpoint date + "X days ago"
   - Next follow-up date (highlighted red if overdue)
   - "How we met" (1 line)
   - Recent context (last 1-2 sentences I noted)
   - Tags (e.g., "VC, intro by Sarah, hiring engineers")
   - Edit / Delete buttons

4.ADD/EDIT MODALwith fields:
   - Name (required)
   - Role / Company
   - Email / Phone (optional)
   - Relationship strength dropdown
   - How we met (text area)
   - Last touchpoint (date picker, defaults to today)
   - Next follow-up (date picker, optional)
   - Notes (text area)
   - Tags (comma-separated)

5."NEEDS FOLLOW-UP" SECTIONat the top — auto-surfaces every contact whose follow-up date is today or overdue. Includes a "Mark Touched" button that updates last-touchpoint to today and clears the follow-up.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save all contacts using the artifact persistent storage API on window.storage, and load them once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Clean, modern, minimal. Light background, dark text. Accent color: red (#d02e2e).
- Inter or system-default font.
- Cards with subtle shadow + 8px border-radius.
- Mobile responsive: cards stack to one column under 768px.NICE-TO-HAVES- Search bar at top to filter contacts by name, company, or tag
- Export-to-CSV button
- Quick "Log Touchpoint" action that updates last-touchpoint without opening the full edit modal

Build it, then ask me if I want to seed it with my first 3-5 contacts.
SECTION

Habit Tracker

Build time: 5 minDaily check-in

A heatmap-style habit tracker with streak counters and visual progress. The kind people pay $5/month for — built and yours forever in 30 seconds.

PROMPT / WORKFLOW CODE
Build me a habit tracker as an interactive HTML artifact.STRUCTURE1.HEADER— "My Habits" title + today's date + "X of Y habits done today" counter

2.HABITS LISTFor each habit, show a row with:
- Habit name (e.g., "Morning walk")
- Today's checkbox (big, tappable, satisfies on click)
- Current streak (🔥 with number)
- Best streak ever
- 30-day mini-heatmap to the right (5 rows × 6 cols of small squares, dark = done, light = missed)
- Edit/delete icons

3.ADD HABITbutton + modal
- Habit name (required)
- Frequency (Daily, Weekdays only, Custom days of week)
- Target time of day (optional: morning / afternoon / evening / anytime)
- Why this matters (optional, displayed on hover)

4.WEEKLY VIEWsection
A 7-day grid showing all habits across the last 7 days. Quick-tap to toggle any cell.

5.STATS PANELat the bottom:
- This week's completion rate (X out of Y possible check-ins)
- Best habit this week (most consistent)
- Worst habit this week (least consistent)
- Total streaks activeBEHAVIOR- Clicking today's checkbox should feel SATISFYING — brief animation, color change, streak counter ticks up.
- If I miss a day, streak resets to 0 (don't try to be too forgiving — the streak should mean something).
- Show a small celebration (confetti or color flash) when a habit hits a 7-day, 30-day, 90-day streak.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save all habits and completion history using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Clean, minimal. Dark mode default with optional light toggle.
- Heatmap squares should feel like GitHub's contribution graph.
- Mobile responsive: heatmap can scroll horizontally on small screens.NICE-TO-HAVES- "Mark all done" button for late-night catch-ups
- Reminder for habits not done by 8pm (visual pulse on the row)
- Export streaks to a shareable image

Build it, then ask me what 3 habits I want to start tracking.
SECTION

Decision Matrix

Build time: 5 minUse any time you're stuck

Drop in a decision. Add 2-5 options. Add the criteria you actually care about with weights. Score each option. Get a clear winner with the math shown. Stops you from spiraling.

PROMPT / WORKFLOW CODE
Build me a Decision Matrix as an interactive HTML artifact.STRUCTURE1.DECISION FRAMEA field at the top: "I'm deciding..." (1-2 sentence input).
Below it: "Deadline" date picker (optional).

2.OPTIONSA row of cards (2-5 options, user can add/remove):
- Option name (e.g., "Take the new job")
- Quick description (1-2 lines)
- Add Option / Remove Option buttons

3.CRITERIAA row of criteria the user adds (3-7 typical):
- Criterion name (e.g., "Compensation," "Growth potential," "Location")
- Weight slider (1-10, higher = more important)
- Default to: Cost, Speed, Risk, Reversibility — user can edit/replace

4.SCORING GRIDA table with options as rows and criteria as columns. Each cell:
- A score from 1-10 (slider or click-to-set)
- A small notes field for "why I scored this way"

5.WEIGHTED RESULTAt the bottom, a live-calculated weighted score for each option:
- Visual bar chart showing relative scores
- Winner option highlighted in green
- Show the math: "Option A: (8×9) + (6×7) + (9×5) = 159"

6.SECOND-ORDER QUESTIONSAfter scoring, surface 3 questions to pressure-test the result:
- "What would have to change for the loser to win?"
- "Is the weight on [highest-weighted criterion] right?"
- "Is there a hidden criterion you haven't named?"

7.SAVE DECISIONButton to save this matrix as a "completed decision" with date. Build a small history at the bottom: every decision I've made with this tool, the option I picked, and a "revisit" button to check my reasoning later.BEHAVIOR- Scores update the weighted total in real time.
- If two options are within 5% of each other, surface: "These are functionally a tie — what's the tie-breaker?"DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save my matrices using the artifact persistent storage API on window.storage so I can revisit past decisions, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Clean grid layout. Light background, clear typography.
- Use color to signal: green for winner, red for biggest gap to winner.
- Mobile responsive: criteria collapse into expandable sections under 768px.

Build it. Then ask me what decision I want to run through it first.
SECTION

Travel Itinerary Builder

Build time: 10 minPer-trip use

Drop in a city + dates + your preferences. Get back a day-by-day plan you can actually follow — with morning, afternoon, and evening blocks. Plus a packing list and a budget tracker.

PROMPT / WORKFLOW CODE
Build me a Travel Itinerary Builder as an interactive HTML artifact.STRUCTURE1.TRIP HEADER- Destination (city, country)
- Dates (start + end, calculates trip length)
- Travelers (solo, couple, family with kids' ages, group size)
- Vibe (chill / packed / mix — affects pace)
- Budget (per day or total)
- Travel preferences (foodie, museums, outdoors, nightlife, shopping, history, nature, off-the-beaten-path)
- Mobility constraints (lots of walking ok? need taxis? wheelchair accessible?)

2.DAY-BY-DAY PLANFor each day, generate a card with:
- Day number + date + day of week
- MORNING block (8am-12pm): activity + 2-3 sentences on why
- AFTERNOON block (12pm-5pm): activity + lunch suggestion
- EVENING block (5pm-late): activity + dinner suggestion
- Estimated cost for the day
- "Pace" meter: relaxed / moderate / packed
- Edit button to swap any block

3.BUDGET TRACKERSidebar showing:
- Total estimated trip cost (sum of all days)
- Cost per day average
- Remaining vs. stated budget
- Color-coded (green if under, yellow if close, red if over)

4.PACKING LISTAuto-generated based on trip length, climate, and activities. Categorized:
- Clothing (with quantities based on trip length)
- Toiletries
- Tech (chargers, adapters for the country)
- Documents (passport, copies of reservations, etc.)
- Activity-specific gear

Each item: checkbox to mark "packed."

5.RESERVATIONS LOGPlace to paste flight numbers, hotel confirmations, restaurant bookings. Sorted by date.

6.FREE TIME / FLEXFor each day, leave 1-2 hours unscheduled. Show as "Wander time" so I'm not stuck on rails.BEHAVIOR- Each activity block should be specific (named restaurant, named museum) not generic ("eat lunch")
- If two activities are far apart, suggest the right way to get between them
- Flag opening hours if relevant (e.g., "Closed Mondays")
- If anything requires advance booking (popular restaurant, sold-out attraction), flag it on the dayDATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save trips using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable. Show a "My Trips" sidebar with past and upcoming.DESIGN- Magazine-feel. Beautiful typography. Use a hero photo for the destination at the top.
- Color palette: warm, travel-inspired (cream, sand, terracotta, navy).
- Mobile responsive: day cards stack vertically on phones.

Build it. Then ask me where I'm going first.
SECTION

Recipe Generator (Photo Input)

Build time: 10 minPhoto + prompt

Snap a photo of your fridge or pantry. Get back 3 dinner ideas using what you have, plus a grocery list for the 2-3 things you're missing. Stops the "what's for dinner" spiral.

PROMPT / WORKFLOW CODE
Build me a Recipe Generator as an interactive HTML artifact. I'll attach a photo of my fridge / pantry / countertop and you'll generate 3 dinner ideas + grocery list.STRUCTURE1.SETUP (FIRST USE)Ask me before generating recipes:
- Dietary restrictions (vegetarian, vegan, gluten-free, dairy-free, allergies)
- Foods I refuse to eat
- How many people I'm feeding
- Cooking skill (5-min meals / 30-min meals / I love to cook)
- Equipment I have (oven, stove, instant pot, air fryer, grill, microwave only)
- Cuisines I love (Italian, Mexican, Thai, etc.)

Save in a "PROFILE" section at the top of the artifact.

2.UPLOAD AREABig drop zone: "Drop a photo of your fridge or pantry." Accepts photos.

3.INGREDIENT INVENTORYAfter photo analysis, list every visible ingredient with:
- Item name
- Estimated quantity (rough)
- Approximate freshness (fresh / use soon / questionable)

Let me edit the list (add things you missed, remove things you got wrong).

4.3 RECIPE CARDSEach card:
- Recipe name (specific, not "chicken stir fry")
- Total time (prep + cook)
- Difficulty level
- What's used from my fridge (highlighted)
- What I need to grab (small list)
- Full ingredient list with measurements
- Step-by-step instructions (numbered, concise)
- Estimated cost for missing ingredients
- "Why this recipe" (1 line on what makes it work tonight)

5.CONSOLIDATED GROCERY LISTIf I pick a recipe, generate a clean grocery list for ONLY the missing ingredients. Sorted by store section (produce, dairy, pantry, meat).

6.USE-IT-UP MODEIf anything in my fridge is "use soon" or "questionable," suggest a recipe specifically built around using those items first.BEHAVIOR- Recipes should feel real, not generic. Specific seasoning, technique, finishing touch.
- If I have a half-bottle of wine, half a jar of capers, leftover rice — build a recipe that USES the half-eaten things, not pristine new ingredients.
- Recipes should respect my skill level and equipment.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save my profile and the last 5 generated recipes using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Warm, kitchen-y feel. Cream background, deep red accents, clean typography.
- Recipe cards feel like a polished cookbook.
- Mobile responsive: works while I'm in the kitchen on my phone.

Build it. Then prompt me to upload a photo of my fridge.
SECTION

Daily Journal + Mood Tracker

Build time: 5 min3 minutes a day

Type 3 lines a day. Claude tracks patterns, surfaces themes, asks better questions over time. Therapy-adjacent, not therapy. The journal that pays attention.

PROMPT / WORKFLOW CODE
Build me a Daily Journal + Mood Tracker as an interactive HTML artifact.STRUCTURE1.TODAY'S ENTRYAt the top:
- Date (auto-filled with today)
- Mood slider (1-10) with emoji feedback
- Energy slider (1-10)
- Sleep last night (hours + quality 1-10)
- Stress level (1-10)
- 3-line free-form text box: "What's true today?"
- "Save Entry" button

2.RECENT ENTRIESBelow today's entry, show the last 7 days as small cards:
- Date
- Mood emoji
- First line of text
- Click to expand the full entry

3.WEEKLY PATTERNSA panel showing:
- This week's mood/energy trend (line graph)
- Best day this week + what I wrote
- Hardest day this week + what I wrote
- One pattern detected (e.g., "Mood drops on Mondays" or "Energy is highest after gym days")

4.MONTHLY VIEWA heatmap calendar of the last 30 days, color-coded by mood. Click any day to see the entry.

5.THEMESOnce I have 14+ entries, surface:
- Recurring topics (work, family, health, money, specific people)
- Words that appear often
- Emotional patterns I might not see

6.BETTER QUESTIONS MODEIf I'm stuck on what to write, give me a smart question based on my recent entries:
- If I've been venting about work for 3 days: "What would have to be true for this to feel different?"
- If I haven't mentioned sleep in 7 days: "How have you been sleeping?"
- If something positive shows up: "Want to dig into what made today good?"BEHAVIOR- Don't perform empathy. Don't say "that sounds really hard." Just be a good listener: "I noticed [pattern]. Want to talk about it?"
- Match my tone. If I'm flat, be flat. If I'm overwhelmed, be calm.
- Never minimize. Never compare ("at least you have..."). Never give advice unless asked.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save all entries using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable. Privacy-first: my entries stay in my own artifact and are never sent anywhere.DESIGN- Soft, calming. Cream/off-white background. Generous white space.
- One accent color (a muted blue or sage green — not bright red).
- Mobile responsive: works on phone for nightly check-ins.SAFETYIf I write about self-harm, suicidal thoughts, or being in crisis, surface this message at the top of the next response: "I want to make sure you have real human support. Please reach out to 988 (Suicide & Crisis Lifeline, US) by call or text. I'll still be here when you're ready — but please talk to a real person right now."

Build it. Then ask me how today is going.
SECTION

Workout Logger

Build time: 10 minUse mid-workout

Log every set. Live progressive overload math. Last week's numbers shown next to today's. The kind of tool people pay $15/mo for — built and yours forever.

PROMPT / WORKFLOW CODE
Build me a Workout Logger as an interactive HTML artifact, designed for mid-workout use on a phone in the gym.STRUCTURE1.SESSION HEADER- Date
- Workout name (Push / Pull / Legs / Upper / Lower / etc.)
- Time started + elapsed timer
- Total volume so far (sum of weight × reps across all sets)

2.EXERCISE CARDSFor each exercise in today's workout:
- Exercise name + planned sets × reps
- Last week's actual numbers (smaller, dimmed, right side)
- Today's set log (filling in as I tap)
- NEXT SET TARGET (BIG, prominent — the number I read between sets)
- Quick-tap buttons:
  - "Same as last set"
  - "+2.5 lbs"
  - "+5 lbs"
  - "−5 lbs"
  - "+1 rep"
- Form cue (1 line, my own reminder from past sessions)

3.LOG SET FLOWWhen I tap "Log Set":
- Weight (number input, defaulted to last set's weight)
- Reps (number input, defaulted to target)
- RPE 1-10 (slider, optional)
- "Save Set"
After save: show me the recommended NEXT set target based on progressive overload rules.

4.PROGRESSIVE OVERLOAD LOGICAfter each set:
- Hit reps at target RPE: same weight, same target next set OR +2.5lb if it's the last set of the exercise
- Exceeded reps at low RPE: +5-10 lb next session
- Missed reps OR RPE too high: repeat or back off 5-10%
Show the reasoning in 1 line: "Last set 185x8 RPE 8. Hit reps under target RPE → +5 lb."

5.REST TIMERAuto-starts when I log a set. Default 90 seconds, configurable per exercise (compound: 2-3 min, isolation: 60-90s).

6.SESSION SUMMARYAt end of workout: total volume, PRs hit, exercises that progressed, exercises that stalled. One-tap export to share or save.

7.HISTORYPast sessions list. Tap any to see the full log + numbers.BEHAVIOR- Optimized for sweaty thumbs. Big tap targets. Big numbers.
- Dark mode default (gym lighting is harsh).
- Auto-fill defaults so I'm not typing more than necessary.
- Celebrate PRs with a quick visual flash.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save all sessions using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable. Show the last 4 weeks of history per exercise.DESIGN- Mobile-first. Phone-only optimized.
- Dark background, high-contrast text.
- One accent color for the NEXT TARGET callout.

Build it. Then ask me my training program (split + current weights for key lifts).
SECTION

Reading List Ranker

Build time: 5 minWeekly use

Drop your "saved for later" pile in. Claude ranks each item by ROI to your current goals. Tells you what to read first, what to skip, what to revisit later. Stops the doom-save loop.

PROMPT / WORKFLOW CODE
Build me a Reading List Ranker as an interactive HTML artifact.STRUCTURE1.GOALS PANEL(top)
A section where I define my current 90-day priorities (3-5 goals). These become the "filter" for ranking content.

2.ADD ITEMform:
- URL or title
- Type (Article / Podcast / Video / Book / Newsletter)
- Source (publication / channel)
- Estimated time to consume (minutes)
- Manual notes (optional: why I saved it, what I expect to learn)

3.RANKED LISTEach item gets a score 1-10 against my current goals. Sort by:
- ROI score (default)
- Time to consume (shortest first, useful for busy weeks)
- Date saved (oldest first, surface forgotten gems)
- Type

For each item, show:
- Title + source + type icon
- Time
- ROI score (with reasoning on hover: "This ties to your 'sales skills' goal — specifically the negotiation framework")
- Days since saved
- Buttons: "Read Now" / "Skip" / "Mark Read" / "Move to Someday"

4.WHAT TO READ THIS WEEKsection
Surface 5-7 items based on:
- Highest ROI scores
- Time slots I told you I have this week
- Variety (don't push 5 articles on the same topic)

5.RUTHLESS CULL MODEFor items 30+ days old still unread:
- "Read it now" / "File as someday-maybe" / "Let it go"
Default toward "let it go." Most saved-for-later articles are not worth the guilt.

6.READ TRACKINGWhen I mark something read, prompt:
- "What's the one takeaway you want to remember?" (1 sentence)
Save it tied to the item. Build a "Past Insights" panel I can search.

7.SOURCE BALANCEOnce I have 30+ items: surface a panel showing % of consumption by source/topic. Flag if I'm in an echo chamber.BEHAVIOR- Be ruthless. Default to "skip" when in doubt.
- If nothing in my queue is worth this slot, say so: "Nothing here is worth your 30 minutes today. Take a walk."
- Don't pad recommendations to seem helpful.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save my list, goals, and read history using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Clean, library-feel. White background, serif headers, sans body.
- Color-code by ROI: green (high), yellow (medium), gray (low).
- Mobile responsive: list stacks vertically on phone.

Build it. Then ask me to define my top 3 priorities for the next 90 days.
SECTION

Goal Accountability Dashboard

Build time: 10 minWeekly check-in

Add 3-5 goals with deadlines. Weekly check-ins. Visual progress bars. The artifact tells you when you're slipping — before it becomes a problem.

PROMPT / WORKFLOW CODE
Build me a Goal Accountability Dashboard as an interactive HTML artifact.STRUCTURE1.HEADER- "My Goals" title
- Today's date
- Days remaining in current quarter
- Overall progress score across all active goals

2.ADD GOALform:
- Goal name (specific, not "exercise more")
- Why this matters (1-2 sentences)
- Deadline (date)
- Success criteria (what does "done" look like, quantitatively)
- Weekly milestone (what should I have done by end of each week)
- Category (Career / Health / Finance / Relationships / Personal Growth)

3.GOAL CARDSgrid
For each active goal:
- Goal name
- Category icon
- Progress bar (% to deadline + % to success criteria)
- Days until deadline
- Last check-in date + how I rated my progress
- Trend arrow (gaining ground / on track / falling behind)
- "Check In" button

4.WEEKLY CHECK-IN FLOWWhen I click "Check In" on a goal:
- "What did you do this week toward [goal]?" (text)
- "On a scale of 1-10, how on-track do you feel?" (slider)
- "What got in the way?" (text, optional)
- "What's the ONE thing to do this coming week?" (text)
- Save and update the progress bar.

5.SLIPPING DETECTORThe artifact watches each goal. If I've missed 2+ weekly check-ins OR rated myself below 5/10 for 2 weeks in a row, surface a "You're slipping" panel:
- Which goal
- What I last said was getting in the way
- The smallest possible next step to recover momentum
- A draft email to a friend/accountability partner asking for support
(Note: artifacts can't actually send email — this generates a draft you can copy and send manually.)

6.WINS LOGEvery check-in where I made progress goes into a wins log. At quarter-end, generate a summary of every win, sorted by goal.

7.QUARTERLY REVIEWOn the last day of each quarter (March 31, June 30, etc.), prompt:
- Which goals hit?
- Which didn't?
- What patterns showed up?
- What goals matter for next quarter?BEHAVIOR- Be honest about progress. Don't inflate.
- If a goal hasn't been touched in 21+ days, ask: "Is this still a real goal? Or is it time to pause or drop it?"
- Encourage smallest-possible next steps when I'm stuck.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save my goals, check-ins, and wins log using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Motivating but not cheesy. Clean dashboard feel.
- Use color to signal status: green (on track), yellow (slipping), red (at risk).
- Mobile responsive: goal cards stack on phone.

Build it. Then ask me what 3 goals I want to set up.
SECTION

Personal Stylist (Photo Input)

Build time: 10 minPhoto + prompt

Photo of your closet. Get back outfit ideas for any event using only what you already own. Stops you from buying clothes you have versions of and stops the "I have nothing to wear" spiral.

PROMPT / WORKFLOW CODE
Build me a Personal Stylist as an interactive HTML artifact. I'll attach photos of my closet (or specific sections of it) and you'll catalog my clothes and generate outfits for events.STRUCTURE1.SETUP (FIRST USE)Ask me:
- Sex / typical sizing (so suggestions match my body)
- Style words I'd use to describe my taste (e.g., "minimal," "preppy," "elevated casual")
- Climate I live in (so I know what season we're working in)
- Colors I love / avoid
- Any items I'm willing to wear / never wear (e.g., "no shorts ever," "love a midi dress")
- Lifestyle (mostly office, mostly casual, mix, lots of events)

Save in "PROFILE."

2.UPLOAD CLOSETDrop zone: "Photo of your closet (or sections of it)." Accepts multiple photos.

3.WARDROBE INVENTORYAfter photo analysis, catalog every visible item with:
- Type (top / bottom / dress / outerwear / shoes / accessory)
- Color
- Pattern (solid / stripe / floral / etc.)
- Style (casual / business / formal / loungewear)
- Season (year-round / cold-weather / warm-weather)

Let me edit the inventory (add things you missed, remove duplicates, correct categories).

4.EVENT INPUTA field where I type the event:
- "Brunch with friends on Sunday, casual"
- "Client dinner Thursday, business casual, restaurant in the city"
- "Long-haul flight Tuesday, want to look put-together but be comfortable"
- "Beach wedding in Mexico, flexible dress code"

5.OUTFIT SUGGESTIONSGenerate 3 outfit options using ONLY items in my inventory:
- Top + bottom + outerwear (if needed) + shoes + accessories
- Why this works for the event (1 line)
- What the outfit signals (vibe)
- Confidence score (how sure you are it works)

If I'm missing something specific (e.g., "no formal shoes for this event"), flag it: "Missing one piece — you don't have anything that pairs with this dress for a formal event. Consider [specific item] if you want to invest."

6.WORN LOGAfter I wear an outfit, mark it as worn (with date + event). Avoids re-suggesting the same outfit too soon.

7.WARDROBE GAPSOnce I have 30+ items cataloged, surface gaps:
- "You have 12 tops and 2 bottoms — you're top-heavy. Consider 2-3 versatile bottoms."
- "Nothing in your closet works for a black-tie event. Plan for that."
- "Lots of black/navy. Consider one statement color piece."

8.SHOPPING NO-LISTSurface items I already have versions of so I stop accidentally buying duplicates.BEHAVIOR- Suggest, don't dictate. If I push back, adjust.
- Don't make me feel bad about anything in my closet.
- If something doesn't suit my body type or style, just don't suggest it — don't critique.DATA PERSISTENCEClaude artifacts cannot use localStorage or sessionStorage. Do not use them. Save my profile, inventory, and worn log using the artifact persistent storage API on window.storage, and load once when the tool opens. Wrap every storage call so the tool still runs from memory and never crashes if storage is unavailable.DESIGN- Magazine / fashion-feel. Clean grid for outfit cards. Beautiful photography aesthetic.
- Soft, neutral palette.
- Mobile responsive: works while I'm getting dressed.

Build it. Then ask me to upload my first closet photo.
SECTION

Pick One. Build It Saturday Morning.

If you only build one of these, make it the Habit Tracker (Build #2). It takes 5 minutes, it works on your phone, and it'll be the most-used tool you make this weekend.

If you want the highest "wow" factor, build the Personal CRM (Build #1) or the Recipe Generator (Build #5) — both feel like real apps. Your friends won't believe you didn't pay for them.

AI SYSTEMS ARCHITECTURE NOTE Somya's Strategic Takeaway

The real unlock of AI agents is not full autonomy, but human-in-the-loop systems design. Structure your agent inputs with explicit constraints, negative prompts, and automated test checkpoints. When building tools, keep token consumption lean by caching system prompts and isolating tasks into specialized sub-agents.

⚡ SCALING AI & GROWTH SYSTEMS?

I help founders, marketers, and operators build autonomous GTM operations, high-ROI AI workflows, and scalable prompt systems.

Book a Growth Consultation ->
Hey, I'm Mini Somya. Click me to chat.