🎨 Web Performance Seo
Fix PageSpeed Insights/Lighthouse accessibility "!" errors caused by contrast audit failures (CSS filters, OKLCH/OKLAB, low opacity, gradient text, image backgrounds). Use for accessibility-driven SEO/performance debugging and remediation.
npx playbooks add skill zhanlincui/ultimate-agent-skills-collection --skill web-performance-seo
About Web Performance Seo
The Web Performance Seo tool is used to fix accessibility errors identified by PageSpeed Insights and Lighthouse, specifically those related to contrast audit failures, which can be caused by various styling issues such as CSS filters, low opacity, and image backgrounds. This tool connects to frontend development workflows, enabling developers to improve the accessibility and search engine optimization of their web applications. Developers would reach for this tool when addressing accessibility-driven SEO and performance debugging issues, particularly when remediation is needed to resolve cont
This compact 27-word instruction set is purpose-built for frontend development work in AI coding agents. Install with a single command.
Use Cases
- Building responsive UI components and layouts
- Implementing accessible, WCAG-compliant interfaces
- Debugging CSS, animations, and cross-browser issues
- Integrating design systems and component libraries
Example Prompts
System Prompt (27 words)
Fix PageSpeed Insights/Lighthouse accessibility "!" errors caused by contrast audit failures (CSS filters, OKLCH/OKLAB, low opacity, gradient text, image backgrounds). Use for accessibility-driven SEO/performance debugging and remediation.
Frequently Asked Questions
What is Web Performance Seo?
Web Performance Seo is a free frontend development skill for AI coding agents. Fix PageSpeed Insights/Lighthouse accessibility "!" errors caused by contrast audit failures (CSS filters, OKLCH/OKLAB, low opacity, gradient text, image backgrounds). Use for accessibility-driven SEO/performance debugging and remediation.. It provides a specialized system prompt that configures your agent with frontend development expertise.
How do I use Web Performance Seo with Claude Code?
Run npx playbooks add skill zhanlincui/ultimate-agent-skills-collection --skill web-performance-seo in your terminal to install Web Performance Seo into your Claude Code session. It works immediately after installation.
Which AI coding agents work with Web Performance Seo?
Web Performance Seo is compatible with Claude Code, Cursor, GitHub Copilot, Windsurf, OpenClaw, Cline, and any AI agent that supports custom system prompts or .cursorrules files.
Is Web Performance Seo free to use?
Yes, Web Performance Seo is completely free and open source. The full source is available on GitHub at https://github.com/zhanlincui/ultimate-agent-skills-collection/tree/main/web-performance-seo. You only need a subscription to the AI agent you use it with.
