Landing page design images
/imagegen-frontend-web
/imagegen-frontend-web is a Claude Code skill in the Web & Design section. It is maintained by Leonxlnx and published under the MIT license. Generates one horizontal image per website section with a consistent palette and varied layouts, as a design reference for building the page.
Author's description
Elite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections produces 8 images. Never compress multiple sections into one image. Enforces composition variety (not always left-text / right-image), background-image freedom, varied CTAs, varied hero scales (giant / mid / mini minimalist), narrative concept spine, second-read moments, and a single consistent palette across all images. Optimized for landing pages, marketing sites, and product comps that developers or coding models can accurately recreate.
How to ask for it
Generate one reference image per section of my landing pageI need a few hero style options to pick the one that converts bestDesign the visual references for my marketing site with one consistent palette
Install
curl -fsSL https://raw.githubusercontent.com/sgomez-dev/claude-skills/main/install.sh | bashAfter installing with the script, type /imagegen-frontend-web. Using Cursor, Windsurf or Codex? Platform guides
Demo coming soon