Fix placeholder images in Cursor-generated pages

Cursor writes clean code but leaves <img> tags pointing at placeholders or the deprecated source.unsplash.com. One CLI command replaces them with real photos.

Symptom

You asked Cursor to build a landing page and the result has <img> tags pointing at:

Prevention: add tteg to your Cursor rules

Create a .cursorrules file in your project root so Cursor uses real photos from the start:

When you need a real stock photo for a hero, card, testimonial, or section image,
use tteg instead of placeholder URLs.

Install once: uv tool install tteg

Save a photo into the project:
  tteg save "<descriptive query>" ./public/images/<name> --orientation landscape

For multiple images at once:
  tteg batch images.json

Never use: placehold.co, via.placeholder.com, source.unsplash.com/random,
picsum.photos, loremflickr.com — these are placeholders or broken.

Fix it right now: one command

uv tool install tteg
tteg save "modern saas dashboard" ./public/hero --orientation landscape

# then update your component:
# <img src="/hero.jpg" alt="modern SaaS dashboard on laptop screen" />

Use MCP for automatic image handling

Cursor supports MCP servers. Add tteg as an MCP server and Cursor can search and save images directly during code generation:

# In your Cursor MCP config:
{
  "mcpServers": {
    "tteg": {
      "command": "uvx",
      "args": ["tteg-mcp"]
    }
  }
}

With this configured, Cursor can call search_and_save_image to find and download a real photo in one step — no manual image searching needed.

Fill an entire page

If Cursor generated a full landing page with multiple placeholder images, fix them all at once:

# Create a manifest file:
cat > images.json << 'EOF'
[
  {"query": "saas dashboard hero", "output": "./public/hero", "orientation": "landscape"},
  {"query": "developer portrait", "output": "./public/founder"},
  {"query": "team collaborating", "output": "./public/team", "orientation": "landscape"},
  {"query": "customer testimonial headshot", "output": "./public/testimonial-1"}
]
EOF

tteg batch images.json

Before / after

Before (Cursor default)

<img
  src="https://source.unsplash.com/
       random/1200x800"
  alt="Hero"
/>

After (tteg)

<img
  src="/hero.jpg"
  alt="modern office with
       developers at laptops"
/>

The ./public/hero.jpg is a real Unsplash photo committed to your repo, with descriptive alt text that matches the actual image content.

Cursor's placeholder URLs aren't a bug — they're a "fill this in later" signal. The problem is shipping to production without filling them in. tteg reduces that step to one command.

Related

tteg on GitHub →