Claude Skills by KyaniteLabs

WCAG 2.2 AA fix pass for web UI. Use before shipping, or for requests about accessibility, a11y, keyboard navigation, screen readers, contrast, labels, focus, landmarks, target size, reduced motion, or ARIA.

Imagery, illustration, and iconography direction for web UI. Use for hero images, photo treatment, illustration style, icon sets, favicons, OG/social cards, decorative graphics, image-shaped holes, and removing generic AI imagery.

Cognitive accessibility pass for ADHD, autism, dyslexia, and neurodivergent users. Use for readability, plain language, predictability, sensory load, memory burden, time pressure, forms, onboarding, dashboards, docs, and flows.

OKLCH color-system guidance for cohesive palettes and contrast-safe tokens. Use when choosing colors, generating ramps, fixing muddy palettes, creating semantic state colors, checking WCAG contrast, or defining theme variables.

State matrix for interactive UI. Use when building or reviewing buttons, links, inputs, tabs, toggles, menus, cards, or controls that need hover, focus, active, disabled, loading, selected, error, keyboard, or ARIA states.

Honest, Tufte-informed web data visualization. Use for charts, dashboards, metrics, KPI tiles, sparklines, chart accessibility, chartjunk removal, genre choice, lie-factor checks, direct labels, data tables, and themed SVG/HTML.

Design-system interview before new frontend builds or redesigns. Use for vague site/app/landing/dashboard requests, generic-looking UI, direction-setting, aesthetic choices, type/color/density decisions, and DESIGN-SYSTEM.md tokens.

Anti-slop UI review for generated or generic frontend work. Use after LLM UI output, or for requests to remove AI tells: purple gradients, pill CTAs, default type, centered heroes, three-card grids, glassmorphism, and template sameness.

Empty, loading, and error-state design. Use for first-run screens, zero results, empty lists/tables/dashboards, loading skeletons, offline/permission errors, retries, layout stability, and state copy.

Form UX and accessibility pass. Use for forms, inputs, checkout, signup/login, validation, labels, autocomplete, mobile keyboards, inline errors, required fields, disabled submits, and field-level accessibility.

Humanize prose by removing LLM tells. Use for landing copy, docs, READMEs, emails, UI microcopy, release notes, social posts, or requests like humanize, less robotic, remove AI tells, punch up, or make this sound human.

Multilingual-resilient web UI, English/Spanish first-class. Use for localization, translation, text expansion, lang attributes, logical properties, RTL readiness, locale formats, bilingual copy tells, hreflang, and language toggles.

Use when improving an existing website or codebase while retaining its recognizable identity, especially when evidence, scope, or redesign approval is uncertain.

Use when an interface needs purposeful feedback, transitions, or reduced-motion behavior, especially when animation risks jank, interruption bugs, or hidden no-JS content.

Use when a page or component must survive narrow containers, long or translated content, zoom, reflow, or overflow without device-name breakpoints.

Use when layout rhythm, density, or gaps feel arbitrary or inconsistent, or when one product needs different reading pressures without splitting into unrelated spacing systems.

Use when final frontend work needs an evidence-backed ship or hold decision, a fail-closed release gate, or an actionable cross-skill verification report.

Rapid prototyping through constrained randomness. Audits what exists, fixes what is broken, generates fresh design candidates from context, then rolls the dice between valid alternatives. Lock what works, re-roll what doesn't, converge on a direction. Use for design exploration, rapid prototyping, or when a user wants surprise within guardrails.

Use when semantic roles must map coherently across light, dark, forced-colors, or saved theme preferences without contrast or no-flash regressions.

Use when a web product needs a contextual type system, resilient font loading, multilingual glyph or wrap coverage, or readable hierarchy across operational and editorial surfaces.

The workflow delivered measured lift for production teams.