skills.rest
ByeongminLee
ByeongminLeeCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

image-optimizer

Convert jpg, jpeg, png, gif, bmp, and tiff images to WebP using sharp.

2|1|Updated Mar 16, 2026
Search Tags:#frontend#webp#sharp#web-performance#image-optimization#asset-optimization#image-conversion
One-click install
npx skills add https://github.com/ByeongminLee/nextjs-claude-code --skill image-optimizer-byeongminlee
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: image-optimizer
Source: https://github.com/ByeongminLee/nextjs-claude-code/tree/main/template/.claude/skills/image-optimizer
Command: npx skills add https://github.com/ByeongminLee/nextjs-claude-code --skill image-optimizer-byeongminlee

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reduces image asset sizes by converting common formats to WebP, improving load times and overall performance for web projects.

Core Features & Use Cases

  • Batch-convert jpg, jpeg, png, gif, bmp, and tiff images to WebP using the sharp library.
  • Resize images to fit within specified maximum dimensions without upscaling, preserving aspect ratio.
  • Optionally write outputs to a separate directory or replace originals to streamline asset pipelines.

Quick Start

Run the optimizer on your image assets to generate WebP files in-place or in a specified output directory.

Frequently Asked Questions about image-optimizer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I batch convert images to WebP for web performance?▼

Batch convert images to WebP by scanning project directories for jpg, png, gif, bmp, and tiff files, then processing them with the sharp library. Outputs are written to a specified directory or replace the originals to reduce asset size.

Can I resize images during WebP conversion without losing the aspect ratio?▼

Yes, images are resized to fit within specified maximum dimensions during WebP conversion. The process preserves the original aspect ratio and avoids upscaling, ensuring optimized assets fit your layout requirements.

Which image formats are supported for WebP conversion?▼

Supported image formats for WebP conversion include jpg, jpeg, png, gif, bmp, and tiff. The tool scans public, src, or assets directories to locate and process these files using the sharp library.

Do I need the sharp library to convert project images to WebP?▼

Yes, the sharp library is required to convert project images to WebP. It handles scanning supported formats, resizing within max bounds, and writing the optimized WebP files to your output directory.

What is the best way to reduce image asset size in a web project?▼

Converting common image formats to WebP is an effective way to reduce asset size. This process improves load times and overall web performance by writing smaller WebP files in-place or to a specified output directory.

Can I replace original images after WebP conversion?▼

Yes, you can optionally replace original images after WebP conversion. The tool can write WebP files directly in-place or to a separate output directory to streamline your asset pipeline.

Related Skills

Explore More Software Engineering Skills→
evolv3aievolv3ai
3

sharp

Resize, convert, and optimize images with the Sharp library in Node.js.

Community
Intermediate
DexploarerDexploarer
6

image-optimizer

Convert web images to WebP/AVIF formats and generate responsive sizes with picture markup.

Community
Intermediate
7a336e6e7a336e6e
1

Bundling Frontend — Optimisation & Deployment

Optimizes JavaScript and CSS bundles for Next.js applications via code splitting and Tailwind CSS tuning.

Community
Advanced
agongdaiagongdai

compress-imgs

Compress PNG, JPG/JPEG, and WebP images recursively under the project root.

Community
Advanced