skills.rest
ersaf1
ersaf1COMMUNITY
Explore all skills by this author →
GitHub

impeccable

Audit frontend interfaces for accessibility, performance, and responsive design.

Updated Jun 21, 2026
Search Tags:#performance#accessibility#frontend#responsive design#UX#UI design
One-click install
npx skills add https://github.com/ersaf1/Magelang --skill impeccable-ersaf1
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: impeccable
Source: https://github.com/ersaf1/Magelang/tree/main/.gemini/skills/impeccable
Command: npx skills add https://github.com/ersaf1/Magelang --skill impeccable-ersaf1

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides tools and guidance to design, critique, audit, and optimize frontend interfaces, ensuring they are production-grade and user-friendly.

Core Features & Use Cases

  • Design Guidance: Offers detailed rules and best practices for UI design.
  • Commands: Executes specific tasks like crafting, shaping, auditing, and polishing interfaces.
  • Responsive Design: Assists in adapting interfaces to different devices and screen sizes.
  • Motion: Adds purposeful animations and motion to enhance user experience.
  • Accessibility: Ensures interfaces are accessible to all users.
  • Performance: Optimizes interfaces for speed and efficiency.
  • Use Case: If you're working on a website and want to ensure it's user-friendly, performs well, and is accessible, this Skill can help you achieve those goals.

Quick Start

Use the impeccable skill to audit the 'homepage.html' file for performance and accessibility issues.

Frequently Asked Questions about impeccable

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit my frontend code for accessibility and performance issues?▼

To audit frontend code for accessibility and performance, you need a project with relevant code and design documents. The skill evaluates interfaces against web best practices to identify and resolve user experience, speed, and accessibility bottlenecks.

What is the best way to add responsive design to an existing UI?▼

Adding responsive design to an existing UI involves applying iteration commands that adapt interfaces to different screen sizes. This ensures the frontend remains user-friendly and production-grade across various devices.

Do I need design documents to optimize my frontend UI?▼

Yes, optimizing frontend UI requires a project containing relevant code and design documents. These inputs provide the necessary context to accurately evaluate and enhance accessibility, performance, and user experience.

How do I critique and polish a user interface for production?▼

Critiquing and polishing a user interface for production involves executing targeted commands that evaluate UI design rules. This process iterates on visual elements and motion to ensure the interface is optimized for user experience and efficiency.

Can I add motion and animations to my frontend without hurting performance?▼

Yes, you can add motion and animations without hurting performance by applying purposeful motion design techniques. The optimization process ensures animations enhance user experience while maintaining frontend speed and efficiency.

Related Skills

Explore More Design & Creative Skills→
thecomputer07thecomputer07

qsd-ui-review

Audit frontend code with a 6-pillar UI evaluation and generate UI-REVIEW.md.

Community
Advanced
timurgaleevtimurgaleev
5

canary

Monitor post-deploy web apps for defects and performance regressions.

Community
Advanced
viktorbezdekviktorbezdek
10

frontend-design

Create accessible, responsive UI design systems with Tailwind CSS, Radix UI, and shadcn/ui.

Community
Advanced
4lerman4lerman

performance-profiler

Profile Node.js, Python, and Go applications for CPU, memory, and I/O bottlenecks.

Community
Advanced