wshobson/visual-edit-precision
plugins/skill-forge-essentials/skills/visual-edit-precision/SKILL.md
Use when making UI/frontend changes guided by visual context, when the user selects elements visually, draws annotations, or provides screenshots alongside change requests. Also use when editing components where spatial context (element identity, DOM references, layout data) supplements text instructions.
$ install --global
skillsauthnpx skillsauth add wshobson/agents visual-edit-precisionInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jul 8, 2026, 2:16 AM128.2s1 file scanned
SKILL.md
- name:
- visual-edit-precision
- description:
- >-
Visual Edit Precision
Overview
When visual context accompanies a change request (element selections, annotations, screenshots), make targeted, minimal edits. Precision over ambition: change exactly what was indicated, preserve everything else.
Process
When visual context is provided:
- IDENTIFY - What exact element(s) were indicated? Which component file owns them?
- SCOPE - Change ONLY what was pointed at. Don't refactor surrounding code.
- PRESERVE - Keep existing styles, classes, and behavior. Only modify what was asked.
- TARGETED - Make the minimal CSS/markup change that achieves the visual result.
- VERIFY - Confirm the change renders correctly without side effects.
Key Principles
Precision Over Ambition
Visual context gives a SPECIFIC element. Don't:
- Refactor the entire component when only one style was requested
- Change the component's API when only its appearance was pointed at
- Touch logic when only visuals were selected
Do:
- Find the exact file and line for the selected element
- Make the minimal edit that achieves the described visual change
- Preserve all existing behavior, event handlers, accessibility
Multiple Edits
When multiple visual edits arrive:
- Each targets its own element independently
- Don't wait for one to finish before processing another
- If two edits conflict (same element, different requests), handle the most recent
Common Mistakes
- Rewriting an entire component when the user pointed at one button
- Changing global config when only one element's color needs adjusting
- Breaking responsive behavior by adding fixed widths to match a selection
- Ignoring specificity (user indicated ONE card, agent changed ALL cards)
- Removing accessibility attributes (aria-*, role, tabindex) during visual edits
Related Skills
wshobson/pptx-visual-assets
testing
VerifiedTrustedCommunity
Use when selecting and placing approved supporting icons, images, SVGs, diagrams, or infographics in an editable PPTX deck.
38,028SKILL.mdUpdated Jul 19, 2026
wshobson/pptx-slide-specification
testing
VerifiedTrustedCommunity
Use when authoring or repairing a coordinate-explicit JSON specification for an editable PPTX deck.
38,028SKILL.mdUpdated Jul 19, 2026
wshobson/pptx-reference-deck-analysis
data-ai
VerifiedTrustedCommunity
Use when analyzing a reference PPTX for read-only structure, theme, typography, layout rhythm, diagnostics, derived template catalogs, or safe OOXML package inspection.
38,028SKILL.mdUpdated Jul 19, 2026
wshobson/pptx-quality-gates
testing
VerifiedTrustedCommunity
Use when validating or repairing an editable PPTX deck for geometry, accessibility, native editability, source lineage, and OOXML package integrity.
38,028SKILL.mdUpdated Jul 19, 2026