# Image Crop Responsive Qa

> Run responsive image crop QA for websites. Use after adding or changing images, hero media, galleries, product grids, portraits, venue photos, screenshots, background images, object-fit/object-position rules, art-directed picture sources, image dimensions, layout stability, and mobile crop polish.

- **Type:** Skill
- **Install:** `agentstack add skill-thegoat395-codex-skills-image-crop-responsive-qa`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [TheGoat395](https://agentstack.voostack.com/s/thegoat395)
- **Installs:** 0
- **Category:** [Content & Media](https://agentstack.voostack.com/c/content-and-media)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [TheGoat395](https://github.com/TheGoat395)
- **Source:** https://github.com/TheGoat395/Codex-Skills/tree/main/skills/image-crop-responsive-qa

## Install

```sh
agentstack add skill-thegoat395-codex-skills-image-crop-responsive-qa
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Image Crop Responsive QA

Use this skill to catch the crop, focal point, and layout bugs that make premium pages feel careless.

## Workflow

1. Inspect the project, media assets, framework image/video APIs, responsive breakpoints, accessibility requirements, and verification commands.
2. Read [Image Crop Responsive QA Guide](references/image-crop-responsive-qa-guide.md) for detailed direction before changing visuals or code.
3. Define the media's job: proof, desire, navigation, instruction, atmosphere, conversion, or accessibility.
4. Implement with stable dimensions, responsive crops, useful fallbacks, and real content hierarchy.
5. Inspect rendered desktop and mobile states, then refine crop, contrast, loading, labels, captions, and polish.

## Always Protect

- Inspect before coding: framework, image/video components, asset folders, CMS or source content, styling system, responsive breakpoints, performance checks, accessibility checks, and available browser QA commands.
- Treat images and video as content strategy, not decoration: every asset should reveal the real product, person, venue, object, interface, proof, or mood needed by the page.
- Avoid generic stock-like visuals, dark blurred filler, random gradients, and media that crops away the subject users need to inspect.
- Plan desktop, mobile, high-density, slow-network, reduced-motion, no-autoplay, failed-asset, and screen-reader states.
- Reserve layout space with dimensions, aspect-ratio, CSS constraints, or framework image components to avoid layout shift.
- Use meaningful alt text for informative images, empty alt for decorative images, captions/transcripts/tracks for media that needs them, and visible text for critical information.
- Before delivery, inspect rendered desktop and mobile media crops, verify assets load without 404s, and run available lint/build/test/browser checks.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [TheGoat395](https://github.com/TheGoat395)
- **Source:** [TheGoat395/Codex-Skills](https://github.com/TheGoat395/Codex-Skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-thegoat395-codex-skills-image-crop-responsive-qa
- Seller: https://agentstack.voostack.com/s/thegoat395
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.