Skip to content
BeClaude

unslop-ui-skill

New
1GitHub TrendingGeneralby claudiusararu

Stop your AI building generic, AI-looking UI. An anti-slop design skill + a catalog of ~100 AI design tells, for Claude Code, Cursor, v0, and more.

Summary

This skill helps developers break free from generic, AI-generated UI patterns by cataloging over 100 common 'AI design tells' and providing actionable guidance to craft more distinctive, human-feeling interfaces.

  • It's useful for anyone using Claude Code, Cursor, v0, or similar tools to build UIs that stand out.

Install & Usage

1
Create the skills directory
mkdir -p .claude/skills
2
Download the skill file
mkdir -p .claude/skills && curl -o .claude/skills/unslop-ui-skill.md https://raw.githubusercontent.com/claudiusararu/unslop-ui-skill/main/SKILL.md
3
Invoke in Claude Code
/unslop-ui-skill

Use Cases

Identify and eliminate overused AI design patterns like generic gradients, symmetrical layouts, and placeholder text in your UI.
Get specific design alternatives when your AI assistant suggests a clichéd component or layout.
Review an existing UI for AI tells and receive a prioritized list of improvements.
Generate UI code that deliberately avoids common AI design pitfalls from the start.
Learn the vocabulary of AI design tells so you can better direct your AI coding assistant.
Apply anti-slop principles to any frontend framework (React, Vue, Svelte, etc.) for more original interfaces.

Usage Examples

1

/unslop-ui-skill Review my current landing page component for AI tells and suggest 5 concrete changes to make it look more human-crafted.

2

Generate a card component for a dashboard that avoids the top 10 AI design tells listed in the catalog.

3

/unslop-ui-skill Explain the 'generic gradient' tell and show me three alternative background treatments I can use instead.

View source on GitHub
design

Security Audits

LicenseUnknownSourceWarnRepositoryPass

Frequently Asked Questions

What is unslop-ui-skill?

This skill helps developers break free from generic, AI-generated UI patterns by cataloging over 100 common 'AI design tells' and providing actionable guidance to craft more distinctive, human-feeling interfaces. It's useful for anyone using Claude Code, Cursor, v0, or similar tools to build UIs that stand out.

How to install unslop-ui-skill?

To install unslop-ui-skill: create the skills directory (mkdir -p .claude/skills), then run: mkdir -p .claude/skills && curl -o .claude/skills/unslop-ui-skill.md https://raw.githubusercontent.com/claudiusararu/unslop-ui-skill/main/SKILL.md. Finally, /unslop-ui-skill in Claude Code.

What is unslop-ui-skill best for?

unslop-ui-skill is a skill categorized under General. It is designed for: design. Created by claudiusararu.

What can I use unslop-ui-skill for?

unslop-ui-skill is useful for: Identify and eliminate overused AI design patterns like generic gradients, symmetrical layouts, and placeholder text in your UI.; Get specific design alternatives when your AI assistant suggests a clichéd component or layout.; Review an existing UI for AI tells and receive a prioritized list of improvements.; Generate UI code that deliberately avoids common AI design pitfalls from the start.; Learn the vocabulary of AI design tells so you can better direct your AI coding assistant.; Apply anti-slop principles to any frontend framework (React, Vue, Svelte, etc.) for more original interfaces..