What we found

1. 1

   Shouting Section Labels AI-era pattern · 4 on the page

   Every section opens with a tiny uppercase, wide-tracked label that repeats the heading below it.

   Fix: Delete the label, or make it carry information the heading does not.

   What we found

   • 3 small uppercase tracked labels sitting directly above headings

   Pattern in the library →

Motion 5 flagged

New. We watch the page move, hover its cards and turn on the visitor's reduce-motion setting. None of these count toward the grade yet. Two held up in a first hand check (stock timing and ignoring reduce motion); they join the grade once they hold up on a bigger set.

• 100%

  M1Default animation timing Not graded · Flagged

  59 of 59 animated elements use the framework's stock curve and speed.

  Fix: Pick one easing and two or three durations for the product, and use them on purpose.

• 2

  M2Ignores 'reduce motion' Not graded · Flagged

  With the visitor's reduce-motion setting on, 2 animations keep looping. That setting is there for people who get dizzy or sick from motion.

  Fix: Wrap looping and entrance animations in @media (prefers-reduced-motion: no-preference), or use Tailwind's motion-safe: prefix.

• 2

  M3Never-ending loops Not graded · Flagged

  Running forever: mesh-pulse ×1, mesh-drift ×1.

  Fix: Let decoration play once, or tie it to something the visitor did. Keep loops for real live status only.

• 20

  M4Everything fades in on scroll Not graded · Flagged

  20 blocks of text start invisible and fade in as you scroll.

  Fix: Show content on arrival. Save entrance motion for one moment that earns it.

• 8/8

  M5Bounce on hover Not graded · Flagged

  8 of 8 cards and buttons we hovered lift, grow or overshoot.

  Fix: A colour or border change is enough feedback. Movement on every hover makes the page feel loose.

• 0.00

  Page jumps while loading Not graded · Fine

  Layout shift score 0.00. Google treats above 0.10 as poor.

• 0

  Content stuck invisible Measured · Fine

  Everything that should appear did.

• 0

  Animations that move the layout Measured · Fine

  0 elements animate width, height, position or spacing, which makes the browser redo the layout every frame.

On a phone

• no

  Scrolls sideways on a phone Not graded · Fine

  Fits a 390px phone.

• 0

  Tap targets too small Measured · Fine

  0 buttons or links are smaller than 24px and sit too close to the next one (WCAG 2.2 target size).

• 0

  Text too small to read Measured · Fine

  0 runs of body text are under 12px on a phone.

Speed

Page weight

5.4 MB

Scripts

330 KB

Requests

15

Console errors

0

Worth a look

Less reliable on whole pages, so they don't count toward the grade.

• Nothing.

Fix prompt

Written for the tool you build with. Paste it in and rescan.

Please fix these design problems on my site, most important first. Keep my copy, images and brand colours. Change only what is listed.
1. A23 Shouting Section Labels: Delete the label, or make it carry information the heading does not. (Where: 3 small uppercase tracked labels sitting directly above headings)
2. Default animation timing: Pick one easing and two or three durations for the product, and use them on purpose. (Where: 59 of 59 animated elements use the framework's stock curve and speed.)
3. Ignores 'reduce motion': Wrap looping and entrance animations in @media (prefers-reduced-motion: no-preference), or use Tailwind's motion-safe: prefix. (Where: With the visitor's reduce-motion setting on, 2 animations keep looping. That setting is there for people who get dizzy or sick from motion.)
4. Never-ending loops: Let decoration play once, or tie it to something the visitor did. Keep loops for real live status only. (Where: Running forever: mesh-pulse ×1, mesh-drift ×1.)
5. Everything fades in on scroll: Show content on arrival. Save entrance motion for one moment that earns it. (Where: 20 blocks of text start invisible and fade in as you scroll.)
When you are done, list what you changed.

Fix these design problems found on https://cxponent.lovable.app/. Search the codebase for where each one is set (CSS, Tailwind classes, components) and make the smallest change that fixes it. Don't refactor anything else.
1. A23 Shouting Section Labels: Delete the label, or make it carry information the heading does not. (Where: 3 small uppercase tracked labels sitting directly above headings)
2. Default animation timing: Pick one easing and two or three durations for the product, and use them on purpose. (Where: 59 of 59 animated elements use the framework's stock curve and speed.)
3. Ignores 'reduce motion': Wrap looping and entrance animations in @media (prefers-reduced-motion: no-preference), or use Tailwind's motion-safe: prefix. (Where: With the visitor's reduce-motion setting on, 2 animations keep looping. That setting is there for people who get dizzy or sick from motion.)
4. Never-ending loops: Let decoration play once, or tie it to something the visitor did. Keep loops for real live status only. (Where: Running forever: mesh-pulse ×1, mesh-drift ×1.)
5. Everything fades in on scroll: Show content on arrival. Save entrance motion for one moment that earns it. (Where: 20 blocks of text start invisible and fade in as you scroll.)
Then show me a summary of the diff.

Update this page to fix the design problems below. Keep the structure, copy and shadcn components; change Tailwind classes and styles only where needed.
1. A23 Shouting Section Labels: Delete the label, or make it carry information the heading does not. (Where: 3 small uppercase tracked labels sitting directly above headings)
2. Default animation timing: Pick one easing and two or three durations for the product, and use them on purpose. (Where: 59 of 59 animated elements use the framework's stock curve and speed.)
3. Ignores 'reduce motion': Wrap looping and entrance animations in @media (prefers-reduced-motion: no-preference), or use Tailwind's motion-safe: prefix. (Where: With the visitor's reduce-motion setting on, 2 animations keep looping. That setting is there for people who get dizzy or sick from motion.)
4. Never-ending loops: Let decoration play once, or tie it to something the visitor did. Keep loops for real live status only. (Where: Running forever: mesh-pulse ×1, mesh-drift ×1.)
5. Everything fades in on scroll: Show content on arrival. Save entrance motion for one moment that earns it. (Where: 20 blocks of text start invisible and fade in as you scroll.)

Fix these design problems on https://cxponent.lovable.app/. Change only what is listed.
1. A23 Shouting Section Labels: Delete the label, or make it carry information the heading does not. (Where: 3 small uppercase tracked labels sitting directly above headings)
2. Default animation timing: Pick one easing and two or three durations for the product, and use them on purpose. (Where: 59 of 59 animated elements use the framework's stock curve and speed.)
3. Ignores 'reduce motion': Wrap looping and entrance animations in @media (prefers-reduced-motion: no-preference), or use Tailwind's motion-safe: prefix. (Where: With the visitor's reduce-motion setting on, 2 animations keep looping. That setting is there for people who get dizzy or sick from motion.)
4. Never-ending loops: Let decoration play once, or tie it to something the visitor did. Keep loops for real live status only. (Where: Running forever: mesh-pulse ×1, mesh-drift ×1.)
5. Everything fades in on scroll: Show content on arrival. Save entrance motion for one moment that earns it. (Where: 20 blocks of text start invisible and fade in as you scroll.)

The five most important changes. Fix these, rescan, and the next ones move up.

Stop it coming back

Add Slop Patterns to your coding agent. It checks new pages against the same library of 235 patterns before they ship.

Every agentClaude CodeCursorCodexVS CodeWindsurfGemini CLIClaude appOther

Finds the coding agents on your machine and adds it to each one.

npx add-mcp https://sloppatterns.com/mcp

Copy

No account or key needed. Works with any agent that supports MCP.

Share

Badge for your site

<a href="https://sloppatterns.com/score/r/cxponent.lovable.app"><img src="https://sloppatterns.com/score/r/cxponent.lovable.app/badge.svg" alt="Slop Score: D"></a>

Slop Patterns is made by Pavithra Lamahewa at Precious Studio. The grade weighs each AI-era pattern by how much it rose on 4,725 Show HN launch pages, from 2016–19 to 2026 (The Same Page). A pattern counts only when we can point at it on the page. Broken basics and motion are shown but not graded. Scanned 2026-09-25 with detector 1.1.1. Method and library.