No ai design cliches

Skill TheArmagan/skills/no-ai-design-cliches

Agent skills that strip the AI tells from writing, code, and design, and build better working habits.

Install

npx -y skills add TheArmagan/skills --skill no-ai-design-cliches

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
2 stars2 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Avoid the default visual choices that make a web UI look AI-generated, and make intentional ones instead. Use this WHENEVER you build or style a web page, component, landing page, or app screen with CSS or a UI framework. The purple-to-blue diagonal gradient, glassmorphism cards everywhere, a centered hero with an emoji and two gradient buttons, neon glow on dark, and default system-font-only type are the look that signals "a model designed this". Replace each default with a deliberate choice about type, color, spacing, and layout that fits the actual product.

SKILL.md

3.4 KB, as published. Nobody here has run it

No AI design cliches

There is a house style that generated UIs fall into: a violet-to-indigo gradient background, frosted glass cards, a dead-centered hero with a big emoji, two pill buttons (one filled gradient, one outline), and everything floating in generous symmetric padding. None of it is broken, but together it reads as a default, the visual equivalent of lorem ipsum. The fix is not a different cliche; it is making each choice on purpose.

The rule: for type, color, and layout, pick something because it fits this product, not because it is the safe generated default.

The tells, and what to do instead

Purple/indigo gradient on everything. The #7c3aed -> #4f46e5 diagonal is the signature. Choose a palette from the product's actual brand or content. Flat color, or a restrained gradient, beats the default violet.
Glassmorphism by default. backdrop-filter: blur frosted cards stacked everywhere. Use real surfaces and borders; reserve blur for when there is a reason (an overlay over content).
Emoji as hero art and feature icons. A giant rocket in the hero, emoji bullets in the feature grid. Use real iconography and real imagery (see prefer-icons).
Everything centered. Centered hero, centered feature cards, centered CTA. Centering everything removes hierarchy. Use a left-aligned, asymmetric layout where it earns attention.
System-font-only with no type scale. Default font-family and three near-equal sizes. Choose a typeface on purpose and set a real scale with clear jumps between heading and body.
Neon glow on pure black. box-shadow glow on a #000 background for "tech" vibes. Pick a considered dark surface (not pure black) and use shadow for depth, not decoration.
Two gradient pill buttons, side by side. Define a real primary action and a quieter secondary one; they should not look like twins.

How to make it intentional

Start from the content and brand, not a template. What does this product feel like, and what is the one action you want?
Set a type scale and a small color palette first, then build with them.
Establish hierarchy: one clear focal point per screen, not five equal cards.
Use whitespace to group and separate, not just to fill.
When you do use a gradient, glow, or blur, be able to say why it is there.

Before you deliver

Look at the screen and ask: could this exact treatment sit on any other product unchanged? If the gradient, the centered emoji hero, and the glass cards would fit a hundred other sites, it is the default look. Replace the borrowed choices with ones that fit this product's content, type, and brand.

For the words on the page, pair this with no-filler-phrases, no-em-dashes, and no-fancy-ascii. For icons specifically, see prefer-icons.