skeumorphism

Accessible skeumorphic UI components require WCAG 2.2 AA compliance, keyboard-first interaction, and explicit focus states. This skill generates design system instructions enforcing these accessibility constraints while maintaining tactile, playful 3D visual elements.

Skeumorphic design system foundations use specific color tokens like primary #FA3C00, surface #FFFFFF, and text #111827, alongside standardized spacing values of 4, 8, 12, 16, 24, and 32. These tokens ensure visual coherence across tactile 3D components.

Documenting component states requires defining default, hover, focus-visible, active, disabled, loading, and error states. This skill generates implementation-ready guidelines covering these variants with testable accessibility acceptance criteria and do/don't patterns.

Refactoring design systems for skeumorphism requires applying token-driven rules, semantic tokens, and WCAG 2.2 AA standards. This skill guides refactoring component families with explicit focus states, keyboard-first behavior, and QA checklists for code review.

UI component writing guidelines need quality gates anchored to semantic tokens, preserved hierarchy, and explicit do/don't patterns. This skill enforces rules avoiding low-contrast text, inconsistent spacing rhythm, and ambiguous labels.

Skeumorphic interfaces fail accessibility checks when lacking WCAG 2.2 AA compliance, keyboard-first behavior, or visible focus states. This skill provides testable acceptance criteria and QA checklists to identify and resolve these violations.