{
  "id": 15870382,
  "title": "AI website prompts that don't look AI-generated: the 5 decisions that matter",
  "url": "https://urgent.news/2026/10/21/ai-website-prompts-that-dont-look-ai-generated-the-5-decisions-that",
  "topic": "ai",
  "section": "AI",
  "published": "2026-10-21T10:08:06.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/motionsites/ai-website-prompts-that-dont-look-ai-generated-the-5-decisions-that-matter-3d41"
  },
  "original_language": "en",
  "account": "Explore ten websites constructed using Lovable, Bolt, Cursor, or Claude, and you'll likely observe an alarming pattern: identical hero sections on a purple gradient, rounded icon cards, Inter font at a single weight, and a fade-up effect for every section. While the tools themselves are proficient at building exactly what they're instructed, they lack the ability to discern nuance. Consequently, they populate the remaining spaces with generic, statistically average elements, a phenomenon commonly referred to as AI slop. The solution does not lie in crafting longer prompts; rather, it involves providing the model with five precise decisions that it would otherwise make on its own.\n\nFirstly, specify the typeface and design elements. Instead of merely requesting a modern font, provide a clear font pairing, sizes, and weights. For instance, designate headlines in Fraunces with a weight of 600, sizes of 72px on desktop and 44px on mobile, and tight letter-spacing of -0.02em. Similarly, set body text in Inter at 16px with a line-height of 1.6 and a maximum width of 62 characters. Employ a striking contrast between a display face and a more subdued body font to elevate the design.\n\nSecondly, employ named colors and a clear color scheme. Instead of relying on generic terms like \"purple gradient,\" list four or five specific color names and a rule for the accent color. For example, use ink (#0E0E10) for text, paper (#F4F1EA) for the background, stone (#D9D4C7) for borders, and accent (#FF5A1F) for the primary button and a single highlighted word in the headline. Avoid gradients altogether, as they can inadvertently apply to every icon, badge, and hover state.\n\nThirdly, describe the layout structurally rather than relying on vague terms like \"clean hero section.\" Utilize a grid-based system to define the position of each hero element. For instance, establish a 12-column grid with a 1200px container. Align the headline and subcopy left-aligned across columns 1-7, while positioning a product screenshot in columns 7-12, allowing it to bleed 80px off the right edge and slightly overlap the headline column. Explicitly prohibit certain layouts in your prompts, such as stacking buttons or using three identical feature cards, to prevent the model from defaulting to these common patterns.\n\nFourthly, incorporate a single, well-defined motion moment with precise timing specifications. Instead of requesting smooth animations, choose one moment during the user experience and describe it in detail. For instance, specify that on page load, the hero screenshot should scale from 1.05 to 1 and fade in over 900 milliseconds, using a cubic-bezier(0.16, 1, 0.3, 1) easing function. Ensure that all other elements remain static to maintain a sense of restraint and intentional design.\n\nLastly, opt for authentic assets over placeholder content. Rather than using generic stock illustrations or abstract gradients, instruct the model to utilize real product screenshots and minimalistic section dividers. Replace placeholders with actual visuals, such as a real product screenshot (16:10 aspect ratio with a 1px stone border and 12px radius). Avoid decorative elements that contribute to the AI slop aesthetic.\n\nBy incorporating these five specific decisions into your prompts, you can significantly improve the quality and uniqueness of the generated websites. Create a reusable template in your preferred AI platform (Lovable, Claude, or Cursor) to ensure consistent implementation across multiple projects. Test and refine your prompts by comparing the final output against the prompt line by line, quoting the exact instructions when necessary to guide the model towards the desired result.",
  "summary": "Open ten sites built with Lovable, Bolt, Cursor or Claude and you'll often see the same page ten times: a centered hero on a purple gradient, three rounded icon cards, Inter at one weight, and a fade-up on every section. The tools aren't the problem. They're very good at building exactly what they're told, and \"make me a modern landing page\" tells them almost nothing. So they fill every gap with…",
  "key_points": [
    "Specify typeface and design elements precisely",
    "Employ named colors and clear color scheme",
    "Describe layout structurally with grid system"
  ],
  "editors_take": "Moving from vague instructions to granular design specifications allows creators to bypass the generic aesthetic of AI slop and reclaim intentionality in automated web development.",
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}