Blurry blobs behind the headline give the template away.

The Slop Score flags «Blurry color blobs» on 26 of the 63 sloppiest sites in its study and on 2 of the 167 most careful ones. Deleting a couple of classes and showing something real fixes it.

By @ignapradosAI slop3 min read

Two or three circles of color, usually purple, blue or pink, parked behind the headline and blurred until they read as light. They show up on AI-built sites so often they earned a nickname: aurora blobs.

They look harmless because they carry no text and no shape. That is exactly what gives them away: they exist to fill a space nobody knew how to fill.

What it looks like in the code

It is nearly always the same Tailwind block: an empty div, absolutely positioned, fully rounded, saturated, and blurred far past recognition.

<div aria-hidden="true" class="absolute -top-24 left-1/2 h-96 w-96
  -translate-x-1/2 rounded-full bg-violet-500/30 blur-3xl"></div>
<div aria-hidden="true" class="absolute top-40 right-0 h-72 w-72
  rounded-full bg-sky-400/30 blur-2xl"></div>

In Tailwind 4, blur-2xl is filter: blur(40px) and blur-3xl is blur(64px), per its docs. The Slop Score flags any element with a filter: blur() of 40 px or more covering over 20,000 px² (a square roughly 140 px wide), so either class is enough to trigger it. Your result names the element and how much blur it carries.

October called it a myth. November disagrees

The Slop Score's October research was skeptical of this signal: the Reddit complaints about auroras turned out, on review, to be inflated by a keyword match, and the internal call was to lower its weight until it could be measured. The numbers that month already pointed the other way:

  • In the October corpus, on 8 of 27 AI builder sites and 1 of 22 hand-made ones.
  • On Lovable, 6 of its 19 sites in that sample.
  • In the [November study](@guia-estudio), 509 sites measured with the same rules, it appeared on 64. But on 26 of the 63 that scored 55 or more, 41 %, and on just 2 of the 167 under 15, 1 %.

Read that carefully: those 63 sites score high partly because of this signal. What the data does say is that a careful site almost never has it. Few signals in the study split the two groups this sharply.

What the blobs are covering for

The template hero, with a centered headline, gray subtitle and two buttons, leaves a big empty area. The model fills it with colored light because it doesn't know what your product does and has no photo of yours. The blob isn't decorating the hero. It's hiding that the hero has nothing in it.

So I wouldn't swap it for another effect. A dot grid or a radial glow does the same job, and the Slop Score flags those too, as «A grid or dot background» and «A glow behind the hero».

Delete it, then show something real

Search your code for blur-3xl, blur-2xl, blur-[ and filter: blur(. If the element is empty and aria-hidden, it's decoration: delete it. Then look at the hero without it. If it feels bare, that was the real problem, and three fixes hold up:

  • A real screenshot of your product, app or dashboard, large and sharp.
  • A photo of your own: the shop, the team, finished work.
  • Nothing at all: a flat background and a headline big enough to carry the screen.
Remove the blurred color circles from the hero and every section (blur-2xl, blur-3xl, any filter: blur of 40px or more), plus any decorative glow or grid backgrounds. Don't replace them with another effect. In the hero, to the right of the headline, place a screenshot of [describe your product's screen] with an 8px radius and no shadow. Use a single flat background color.

When you ask an AI to do it, name what you don't want, or it puts it back in the next section (the prompt guide has more like this):

Sources

Frequently asked questions

Why do AI-generated websites have colored blobs in the background?

The model has no real content for the hero, so it fills the empty space with heavily blurred circles of color. The effect works for any industry, which is why it repeats everywhere.

What is blur-3xl in Tailwind?

The class that applies filter: blur(64px); blur-2xl applies 40 px. On a colored circle, either one produces the soft blob typical of templates.