7 Tells that a UI is AI-Generated

by Jeff Humble

Dear Reader,

You can see a vibe-coded app from a mile away, if you know what to look for.

Here are seven design patterns that scream amateur vibe coder.

Learn them, avoid them, and stay above the rising tide of slop, my friends.

1. Neon color palette

If it's vibe-coded, it's gotta be neon. To slop this one up to the max, use 5+ neon colors and never pick a single one to focus.

Why AI loves it: Neon-on-dark is overrepresented in "modern UI" training data because it photographs well and gets upvoted on Dribbble. Dark background plus high-chroma accent gets learned as the default for contemporary SaaS.

2. Dark mode glow-up

Every vibe-coded website has that aurora borealis glow thing going on in the background. My eyes appreciate the dark mode, but I can never tell if my screen is broken, dirty, or it's just another AI-generated website.

Why AI loves it: Radial gradients behind hero content appear constantly in gaming, crypto, and AI product sites. The model absorbs "glow equals premium dark mode" without any ability to judge whether it's serving a purpose.

3. Emojis everywhere

If you thought that emojis were just for chatting, you haven't worked with AI as a UI designer. To slop this one up, make emojis the go-to icon, background element, and navigation item.

Why AI loves it: Marketing copy and onboarding flows in the training data use emojis as visual punctuation constantly. They become a learned shorthand for adding hierarchy without needing actual icon assets or design decisions.

4. Purple gradients

I'm sorry if you like purple or Prince because AI has ruined that now. To make it really slop, use purple gradients for your H1s, your buttons, and your backgrounds.

Why AI loves it: Purple-to-blue is statistically the most common gradient in tech product marketing. Thousands of examples from Notion, Linear, Vercel, and their imitators make it the default output for any "innovative software" hero section.

5. Cards, on cards, on cards...

In AI-generated interface land, everything goes in a card. Even cards themselves sometimes go in cards. That way, things can feel organized even as the UI overall becomes more chaotic.

Why AI loves it: The model knows content needs containers but applies that rule recursively, with no cost function for visual weight. Every group becomes a card, and since that card lives somewhere, it gets wrapped in another one.

6. Multicolored side tabs

These are quickly becoming the em-dash of AI-generated UI. To be a proper slopper, every card and block of text gets a little rainbow side tab. And just like a sprinkle on ice cream, it adds color but does nothing for the taste.

Why AI loves it: Tabs have active states, and active states mean color. With no concept of a system-wide color budget, each tab gets its own accent. The model can't reason that four competing colors cancel each other out.

7. Status dots

There was a time once when dots meant something like, "live" or "connected." To become a top sloppper, add them to every UI element in any color you like.

Why AI loves it: Colored indicator dots are everywhere in developer tools and admin UIs in the training data. "Status information" gets pattern-matched to "colored dot," regardless of whether a label would communicate more.

Ok, that's seven, but I'm sure there are more. What did I miss?

ADP List has taken fire in the past for using conference talks in a paid course without notifying the speakers. Apparently, they decided the best way to handle that controversy was to make this fake post about someone leaking that course of stolen content. Talk about tone deaf.

​Source​

Until next week, keep your AI off that purple.

Jeff Humble ​Designer & Co-Founder ​The Fountain Institute

​