LogoClawIndex
CasesSkillsAbout
LogoClawIndex

responsive-images - Implement Responsive Images with srcset, Lazy Loading, and Modern Formats

Implement performant responsive images with srcset, sizes, lazy loading, and modern formats like WebP and AVIF

Tags

Updated: 2026-02-09

Capabilities

Typical Inputs

Typical Outputs

What this skill does

  • add srcset attributes
  • add sizes attributes
  • set lazy loading
  • implement modern formats
  • set fetchpriority
  • prevent layout shift

Inputs

  • image files
  • viewport dimensions
  • screen density
  • image formats

Outputs

  • responsive HTML images
  • picture elements
  • optimized image markup

Requirements

  • HTML support
  • browser image support
  • Core Web Vitals compliance

Source

  • Spec: SKILL.md

ClawIndex

OpenClaw Skills & Use Case Index

ClawIndex is an ecosystem-driven index of OpenClaw skills and real-world use cases.

Index

Skills·
Cases

Meta

About·
Disclaimer·
Email·
GitHub
© 2026 ClawIndex All Rights Reserved.
web performance
responsive design
core web vitals
image optimization
add srcset attributes
add sizes attributes
set lazy loading
implement modern formats
image files
viewport dimensions
screen density
responsive HTML images
picture elements
optimized image markup