skills.rest
45black
45blackCOMMUNITY
Explore all skills by this author →
GitHub

ui-fix

Generate code patches or instructions to fix UI issues from ui-review reports.

1|Updated Feb 12, 2026
Search Tags:#ui#accessibility#css#fix#diff#patch#design-system
One-click install
npx skills add https://github.com/45black/uk-legal-plugins --skill ui-fix
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-fix
Source: https://github.com/45black/uk-legal-plugins/tree/main/skills/ui-fix
Command: npx skills add https://github.com/45black/uk-legal-plugins --skill ui-fix

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Generate implementation instructions or code patches for UI issues identified by ui-review.

Core Features & Use Cases

  • Generates patch or patch-set to fix UI issues across components and design systems.
  • Works with output from /ui-review to create actionable fixes.
  • Example: Given a color contrast issue in a component, produces a patch to adjust CSS variables.

Quick Start

Provide the UI issue details or attach the ui-review output and request a patch or implementation steps.

Frequently Asked Questions about ui-fix

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

FAQPage Schema
How do I generate a CSS patch to fix UI accessibility issues?▼

To fix UI accessibility issues, you can generate a CSS patch by providing the UI issue details. The system produces actionable code patches that adjust CSS variables and align with design-system tokens.

What's the best way to turn a UI review report into actionable code fixes?▼

Turning a UI review report into actionable code fixes involves processing the report output to identify problems. The system then generates implementation instructions or direct code patches to resolve component issues.

Can I apply design system tokens to correct color and spacing problems in web components?▼

Yes, you can apply design system tokens to correct color and spacing problems in web components. The system aligns fixes with design-system best practices to resolve structural and visual discrepancies.

Does the UI fix process support both implementation instructions and code patches?▼

The UI fix process supports multiple output modes, providing both implementation instructions and code patches. You can request either format or both simultaneously to resolve UI issues across your design system.

How do I fix typography and interaction issues across different design systems?▼

To fix typography and interaction issues across different design systems, you input the identified UI problems. The system generates targeted patches or instructions applicable to your specific web UI components.

What types of UI issues can be resolved using automated patch generation?▼

Automated patch generation can resolve color contrast, spacing, typography, structure, accessibility, and interaction issues. It produces concrete fixes tailored to web UI components within established design systems.

Related Skills

Explore More Design & Creative Skills→
MadAppGangMadAppGang
7

design-references

Provide design system references for UI review tasks.

Official
Basic
45black-Limited45black-Limited
1

ui-fix

Generate UI patches or instructions from design-system and WCAG compliance reviews.

Official
Advanced
sgcarstrendssgcarstrends
21

security-audit

Audit codebases for OWASP Top 10 vulnerabilities and generate prioritized remediation reports.

Official
Advanced
takayatomosetakayatomose

web-design-guidelines

Compare HTML, CSS, and JavaScript files against Web Interface Guidelines.

Community
Intermediate