Can it help with WCAG accessibility compliance?

Yes, it audits your code for semantic HTML elements, ARIA labels, required contrast ratios, and interactive focus states.

What is AI Slop Prevention?

This feature flags generic, 'safe', or predictable design patterns typical of basic AI generation, encouraging more distinctive and high-character UI choices.

How does this skill handle hardcoded colors?

It identifies hex codes and arbitrary values within your styles, suggesting replacements from your project's established semantic tokens or Tailwind configuration.

Does it support frameworks other than Tailwind?

While it features specific rules for Tailwind CSS and agenticindiedev-ui, its core logic for UX patterns and accessibility applies to any frontend framework.

Design Consistency Auditor

Name: Design Consistency Auditor
Author: shipshitdev

byshipshitdev

•

Design Tools

Audits and maintains design system consistency, UI/UX patterns, and accessibility standards across frontend applications.

The Design Consistency Auditor skill transforms Claude into a specialized design systems engineer capable of performing deep scans of your frontend codebase. It ensures visual harmony by enforcing semantic tokens over hardcoded values, validating component patterns against established UI standards, and verifying mobile-first responsiveness. Beyond simple styling, it actively prevents 'AI slop'—generic or predictable design choices—and enforces rigorous accessibility standards (WCAG) to ensure your application remains professional, branded, and inclusive.

Key Features

01Comprehensive accessibility checks including semantic HTML and ARIA label verification.

02Automated color palette auditing to replace hardcoded hex values with semantic tokens.

03Mobile-first responsive styling audits using Tailwind CSS best practices.

04UI/UX pattern validation for consistent component styling and visual harmony.

0510 GitHub stars

06Detection and removal of generic AI-generated aesthetics in favor of branded designs.

Use Cases

01Refactoring legacy CSS codebases into modern, token-based Tailwind CSS systems.

02Performing pre-deployment audits to ensure UI consistency and accessibility compliance.

03Reviewing new feature PRs to ensure they adhere to the project's existing design language.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add shipshitdev/library design-consistency-auditor

For use in Claude.ai and ChatGPT

Download Skill