# Prompt 02: Add Categories

Copy and paste this into Claude Code:

---

Add color-coded categories to the todo app. Requirements:

- Four categories: Work (blue #5B9FD6), Personal (green #4DB8A4), Health (orange #E87020), Learning (purple #A87BDB)
- When adding a task, show a dropdown to pick the category
- Each task shows a small colored dot or badge indicating its category
- Add filter buttons at the top: "All", "Work", "Personal", "Health", "Learning"
- Clicking a filter shows only tasks in that category
- "All" shows everything
- Active filter button should be visually highlighted
- Categories are saved in localStorage along with the tasks
- Keep the existing dark mode design

---

## What Happens

Claude Code reads the existing `index.html`, understands the current structure, and adds the category system without breaking anything that already works.

This is the agent loop in action: it does not start from scratch. It reads what exists, plans the changes, and edits precisely.

## What to Expect

- A category dropdown appears next to the task input
- Colored filter buttons appear above the task list
- Each task shows its category color
- Switching filters instantly shows/hides tasks
- Old tasks (without categories) still work