Get a week free of Claude Code →

🎨 Aesthetic Ui Designer

Creates distinctive, production-quality UI designs that avoid generic "AI slop" aesthetics. Activates on ANY frontend/UI creation request including React/Tailwind, React Native, or Swift. Ensures typography, color, motion, and layout choices feel genuinely designed rather than algorithmically genera

QUICK INSTALL
npx playbooks add skill srstomp/pokayokay --skill aesthetic-ui-designer

About

Creates distinctive, production-quality UI designs that avoid generic "AI slop" aesthetics. Activates on ANY frontend/UI creation request including React/Tailwind, React Native, or Swift. Ensures typography, color, motion, and layout choices feel genuinely designed rather than algorithmically genera. This skill provides a specialized system prompt that configures your AI coding agent as an aesthetic ui designer expert, with detailed methodology and structured output formats.

Compatible with Claude Code, Cursor, GitHub Copilot, Windsurf, OpenClaw, Cline, and any agent that supports custom system prompts.

Example Prompts

Get started Help me use the Aesthetic Ui Designer skill effectively.

System Prompt (37 words)

Creates distinctive, production-quality UI designs that avoid generic "AI slop" aesthetics. Activates on ANY frontend/UI creation request including React/Tailwind, React Native, or Swift. Ensures typography, color, motion, and layout choices feel genuinely designed rather than algorithmically genera

Related Skills

Get the best new skills
in your inbox

Weekly roundup of top Claude Code skills, MCP servers, and AI coding tips.