Use when reviewing image assets, markup, and CDN or build transforms related to Use <picture> with an <img> fallback. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.
Install
npx skills add thedaviddias/Front-End-Checklist --skill picture-elementnpx skills add thedaviddias/Front-End-Checklist --skill picture-element -a claude-code -gnpx skills add thedaviddias/Front-End-Checklist --skill picture-element -a codex -ggemini skills install https://github.com/thedaviddias/Front-End-Checklist.git --path skills/picture-elementgh skill install thedaviddias/Front-End-Checklist picture-elementgit clone --depth 1 https://github.com/thedaviddias/Front-End-Checklist /tmp/thedaviddias__Front-End-Checklist
mkdir -p ~/.claude/skills ~/.agents/skills
cp -R /tmp/thedaviddias__Front-End-Checklist/skills/picture-element ~/.claude/skills/picture-element # Claude Code
cp -R /tmp/thedaviddias__Front-End-Checklist/skills/picture-element ~/.agents/skills/picture-element # Codex, Cursor, Gemini CLI, Copilot, OpenCode