site-design-fix

Audit live sites for visual design issues and apply CSS-first fixes.

3|1|Updated Mar 17, 2026

Search Tags:#a11y #frontend #ux #design-system #visual-design #design-audit #css-fixes

Ready to run

npx skills add https://github.com/cogine-ai/cogine-dev-skillset --skill site-design-fix

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: site-design-fix
Source: https://github.com/cogine-ai/cogine-dev-skillset/tree/main/skills/site-design-fix
Command: npx skills add https://github.com/cogine-ai/cogine-dev-skillset --skill site-design-fix

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams audit live websites for visual design quality, identify inconsistencies across pages and breakpoints, and coordinate precise, CSS-first fixes to improve user experience without heavy refactors.

Core Features & Use Cases

Visual audit across pages and breakpoints to evaluate hierarchy, typography, spacing, color contrast, and interaction states.
Generate targeted CSS/Frontend fixes and verification steps, then re-audit to confirm improvements.
Capture annotated screenshots and preserve a design-system-aligned baseline for future work.

Quick Start

Run the site-design-fix workflow against your target URL to start the audit, fixes, and visual verification loop.

Frequently Asked Questions about site-design-fix

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

FAQPage Schema

How do I audit my live website for visual design inconsistencies?▼

To audit a live website for visual design inconsistencies, run a workflow against your target URL. This evaluates visual hierarchy, typography, spacing, color contrast, and interaction states across pages and responsive breakpoints to surface actionable findings.

What is the best way to fix frontend UI issues without heavy refactoring?▼

The best way to fix frontend UI issues without heavy refactoring is applying CSS-first fixes. This approach enforces minimal invasive changes to improve user experience while maintaining a design-system-aligned baseline for future work.

Can I verify design fixes on my live site using before and after visuals?▼

You can verify design fixes using before and after visuals. The workflow captures annotated screenshots as evidence and performs a re-audit to confirm improvements and deliver verifiable outcomes.

Does a design audit cover responsive states and cross-page consistency?▼

A visual design audit does cover responsive states and cross-page consistency. The workflow evaluates your UI across multiple pages and breakpoints to identify visual inconsistencies and interaction state issues.

When do I need a CSS-first design audit for my frontend?▼

You need a CSS-first design audit when your live site has visual inconsistencies but you want to avoid heavy refactoring. It helps coordinate precise frontend polish and improve user experience with minimal invasive changes.