📦
planning-with-files
83Organize Long AI Tasks with Planning Files
Long AI sessions can lose goals, decisions, and progress. This skill guides Claude, Codex, and Claude Code to store plans, findings, and logs in project files.
Productivity View
Skills web-performance-seo
📦
web-performance-seo
Content revision r1 Safe ⚙️ External commands
Fix Lighthouse Contrast Errors
Lighthouse contrast audit failures can hide actionable SEO and accessibility results. This skill gives focused checks and remediation patterns for CSS contrast problems.
Supports: Claude Codex Code(CC)
Install with my Agent
Copy this request to your Agent. It includes the canonical Skill page and manifest.
Agent request
Review the Skillstore skill "web-performance-seo" from https://skillstore.io/skills/zhanlincui-web-performance-seo.md and its manifest at https://skillstore.io/api/skills/zhanlincui-web-performance-seo/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Your Agent should still show its plan and request any confirmation required by the security policy.
Agent-readable resources
Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.
Test it
Using "web-performance-seo". PageSpeed Insights shows an exclamation mark for accessibility after a homepage redesign.
Expected outcome:
Likely causes include transparent gradient text, low opacity cards, and image text without a strong overlay. The next step is to inspect those patterns and verify with local Lighthouse.
Using "web-performance-seo". A component uses blurred card backgrounds and white text over a hero image.
Expected outcome:
- Increase the overlay opacity behind text.
- Remove blur or blend effects from text containers.
- Confirm normal text reaches a 4.5 to 1 contrast ratio.
Using "web-performance-seo". A design system uses OKLCH tokens and Lighthouse fails the contrast audit.
Expected outcome:
Convert risky OKLCH or OKLAB values to supported HSL or RGB fallbacks, then retest contrast in Lighthouse and axe.
Security Audit
Safev5 • 7/8/2026 Open versioned report
All nine static findings are Markdown code fences or read-only search examples, not Ruby backtick execution. The skill provides contrast debugging guidance and shows no evidence of prompt injection, data exfiltration, network access, or destructive commands.
1
Files scanned
93
Lines analyzed
0
Review items
0
False positives ignored
Risk Factors
⚙️ External commands (9)
No confirmed security findings were detected by the latest completed static and semantic audit. This does not prove the skill has no side effects.
Audited by: codex View Audit History →
Share & cite this report
Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.
Copy report link
https://skillstore.io/skills/zhanlincui-web-performance-seo/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown badge
[](https://skillstore.io/skills/zhanlincui-web-performance-seo?utm_source=security_passport_badge)HTML badge
<a href="https://skillstore.io/skills/zhanlincui-web-performance-seo?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/zhanlincui-web-performance-seo/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Embed card
<iframe src="https://skillstore.io/embed/skills/zhanlincui-web-performance-seo.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Academic citations (APA · BibTeX · CFF)
APA citation
ZhanlinCui. (2026). web-performance-seo security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/zhanlincui-web-performance-seo/audits/5BibTeX citation
@techreport{zhanlincui-zhanlincui-web-performance-seo-2026,
author = {ZhanlinCui},
title = {web-performance-seo security audit report (audit version 5)},
institution = {Skillstore},
year = {2026},
number = {5},
url = {https://skillstore.io/skills/zhanlincui-web-performance-seo/audits/5},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-performance-seo security audit report (audit version 5)"
version: "unspecified"
type: report
authors:
- name: "ZhanlinCui"
date-released: "2026-07-08"
url: "https://skillstore.io/skills/zhanlincui-web-performance-seo/audits/5"
identifiers:
- type: other
value: "skillstore:zhanlincui-web-performance-seo:audit:5"
description: "Skillstore immutable audit report identifier"
Skillstore Score
Why this score Evidence Confidence: High 55
Architecture
85
Maintainability
87
Content
70
Community
91
Spec Compliance
What You Can Build
Repair a Broken Lighthouse Score
Find CSS patterns that cause the accessibility score to show an exclamation mark instead of a numeric score.
Prepare SEO Remediation Notes
Translate PageSpeed Insights contrast failures into clear tasks for design and engineering teams.
Review Contrast Risk Before Release
Check overlays, gradients, opacity, and color formats before publishing a redesigned page.
Try These Prompts
Start a Contrast Audit
Use this skill to review my Lighthouse accessibility exclamation mark. Start with likely contrast audit causes and list the first checks.
Scan CSS Triggers
Scan my project for filters, OKLCH or OKLAB colors, low opacity backgrounds, gradient text, and text over images.
Plan Safe Fixes
Review these Lighthouse contrast findings and propose fixes that preserve the visual design while meeting contrast thresholds.
Validate a Release Candidate
Audit the changed pages for contrast-related Lighthouse failures, then create a verification checklist for Lighthouse, axe, and PageSpeed Insights.
Best Practices
- Reproduce the Lighthouse or PageSpeed Insights failure before editing styles.
- Prioritize fixes that create stable contrast across themes and browser modes.
- Retest locally before waiting for PageSpeed Insights cache updates.
Avoid
- Treating an accessibility exclamation mark as a normal low score.
- Keeping transparent gradient text without a solid color fallback.
- Using decorative image overlays that are too weak for readable text.
Frequently Asked Questions
What problem does this skill solve?
It helps fix Lighthouse and PageSpeed Insights accessibility failures caused by contrast audit errors.
Does it cover every Lighthouse audit?
No. It focuses on contrast-related accessibility failures that can affect SEO reporting.
Can it run PageSpeed Insights for me?
No. It gives a workflow and checks, but users must run Lighthouse, axe, or PageSpeed Insights separately.
Which CSS issues does it target?
It targets filters, blend modes, OKLCH or OKLAB colors, low opacity, gradient text, and text over images.
What contrast ratios should I verify?
Verify at least 4.5 to 1 for normal text and 3 to 1 for large text.
Is this useful with Claude, Codex, or Claude Code?
Yes. It provides clear review steps that can guide Claude, Codex, and Claude Code in a project workspace.
Developer Details
Author
ZhanlinCuiLicense
MIT
Skillstore revision
r1
Version notice
The author did not declare a version.
Repository
https://github.com/ZhanlinCui/Ultimate-Agent-Skills-Collection/tree/main/web-performance-seoRef
88a205c7f635a966e31156313b590d59007c5caa
Maintenance freshness
7/18/2026
Usage
28 downloads · 202 views
File structure
📄 SKILL.md
More from ZhanlinCui
View all📦
github-release-assistant
83Generate Bilingual GitHub Release READMEs
Release notes and README updates can take time before each GitHub release. This skill generates bilingual release documentation and guides review, commit, and push steps.
Documentation View
📦
obsidian-helper
81Organize Obsidian Notes with AI
Obsidian vaults can become hard to review and update consistently. This skill helps Claude and Codex create daily notes, capture ideas, and summarize recent work.
Productivity View
📦
Process PDFs with Extraction and Form Tools
PDF work often requires separate tools for text, tables, pages, and forms. This skill gives Claude, Codex, and Claude Code guided workflows and helper scripts for PDF tasks.
Office & Reports View
📦
frontend-design
79Build Distinctive Frontend Interfaces
Generic web interfaces can feel unfinished and forgettable. This skill guides Claude, Codex, and Claude Code toward polished frontend work with clear visual direction.
Design & Creative View
📦
brainstorming
79Plan Creative Work Before Building
Teams often start implementation before goals, constraints, and trade-offs are clear. This skill guides Claude, Codex, and Claude Code through structured brainstorming before design work begins.
Productivity View
Related Skills
View all📦
swiftui-expert-skill
82Improve SwiftUI Code with Expert Guidance
by avdlee
SwiftUI projects can accumulate state, layout, accessibility, and performance problems. This skill provides focused review guidance and optional Instruments trace analysis to identify practical improvements.
Coding & Development View
📦
fixing-metadata
82Fix HTML Metadata and Social Previews
by ibelick
Missing or inconsistent metadata harms search indexing and social previews. This skill audits page metadata and guides focused fixes across common web frameworks.
Coding & Development View
📦
screen-reader-testing
79Validate Screen Reader Accessibility
by sickn33
Screen reader regressions can hide behind visual checks. This skill gives practical testing steps for VoiceOver, NVDA, JAWS, and TalkBack.
Coding & Development View
📦
fixing-accessibility
79Fix Accessibility Issues in Web Interfaces
by ibelick
Web interfaces often exclude users through missing labels, weak keyboard support, and incorrect focus behavior. This skill audits common accessibility failures and proposes minimal, targeted fixes.
Coding & Development View
📦
tailwind
79Build Tailwind v4 HyperFrames Scenes
by heygen-com
Tailwind v4 browser-runtime projects can fail when teams apply older v3 patterns. This skill gives Claude, Codex, and Claude Code precise HyperFrames guidance for stable styling.
Coding & Development View
📦
design-lint
80Check designs with deterministic CSS rules
by cubha
Design reviews can vary between reviewers and slow down delivery. This skill applies repeatable checks to HTML and CSS so teams can catch token, layout, and accessibility issues before release.
Design & Creative View