pillow-image-processing
Skill8 starsChanged 26 days agoMITView on GitHub
Process images for web development — resize, crop, trim whitespace, convert formats (PNG/WebP/JPG), optimise file size, generate thumbnails, create OG card images. Uses Pillow (Python) — no ImageMagick needed. Trigger with 'resize image', 'convert to webp', 'trim logo', 'optimise images', 'make thumbnail', 'create OG image', 'crop whitespace', 'process image', or 'image too large'.
- Installs packages
In this repository99 other files it gives its agents.
- skills/react-hook-form-patterns/AGENTS.mdAGENTS.md
- skills/zod-schema-validation/AGENTS.mdAGENTS.md
- Add Admin API EndpointSkill
- add-malli-schemasSkill
- add-uint-supportSkill
- analytics-eventsSkill
- analyze-ciSkill
- asyncio-patternsSkill
- axum-web-patternsSkill
- bash-defensive-patternsSkill
- bats-shell-testingSkill
- bazel-build-optimizationSkill
- beautifulsoup-parsingSkill
- changelog-automationSkill
- cheerio-parsingSkill
- clap-cli-patternsSkill
- clojure-writeSkill
- cobra-cli-developmentSkill
- creating-financial-modelsSkill
- dbt-transformation-patternsSkill
- distributed-tracingSkill
- django-patternsSkill
- drizzle-orm-patternsSkill
- fastapi-patternsSkill
- fastify-patternsSkill
- fixSkill
- github-actions-templatesSkill
- gitlab-ci-patternsSkill
- gitops-workflowSkill
- go-cache-hotSkill
- go-concurrency-patternsSkill
- go-errors-oopsSkill
- go-fx-diSkill
- go-monads-moSkill
- go-swagger-codegenSkill
- go-testify-patternsSkill
- grafana-dashboardsSkill
- graphql-schema-designSkill
- grpc-service-definitionSkill
- hono-patternsSkill
- implementing-agent-modesSkill
- implementing-jsc-classes-zigSkill
- istio-traffic-managementSkill
- jest-advanced-patternsSkill
- junit5-testingSkill
- k8s-manifest-generatorSkill
- kysely-query-builderSkill
- langsmith-fetchSkill
- linkerd-patternsSkill
- llm-evaluationSkill
- mcp-builderSkill
- mypy-type-checkingSkill
- networkx-graph-algorithmsSkill
- nx-workspace-patternsSkill
- pandas-dataframe-patternsSkill
- polars-dataframeSkill
- prisma-schema-patternsSkill
- prometheus-configurationSkill
- prompt-engineering-patternsSkill
- pydicom-dicom-parsingSkill
- The first 60 shown.
The file
We split this skill into the rules it gives an agent
4 rules. About 0 are common, 1 is distinctive, and 3 are very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈1
Distinctive · estimate
This author's own choices. Worth a look.
3
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 9
Use img-process (shipped in bin/) for common operations.
- Distinctive: line 35
If Pillow is unavailable, use alternatives:
- Very specific: line 85
When only width or height is given, calculate the other from aspect ratio.
- Very specific: line 102
Remove surrounding whitespace from logos and icons.
≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Image Processing
Use img-process (shipped in bin/) for common operations. For complex or custom workflows, generate a Pillow script adapted to the user's environment.
Quick Reference — img-process CLI
img-process resize hero.png --width 1920
img-process convert logo.png --format webp
img-process trim logo-raw.jpg -o logo-clean.png --padding 10
img-process thumbnail photo.jpg --size 200
img-process optimise hero.jpg --quality 85 --max-width 1920
img-process og-card -o og.png --title "My App" --subtitle "Built for speed"
img-process batch ./images --action convert --format webp -o ./optimisedUse img-process when: the operation is standard (resize, convert, trim, thumbnail, optimise, OG card, batch). This is faster and avoids generating a script each time.
Generate a custom script when: the operation needs logic img-process doesn't cover (compositing multiple images, watermarks, complex text layouts, conditional processing).
Prerequisites
Pillow is required for both img-process and custom scripts:
pip install PillowIf Pillow is unavailable, use alternatives:
| Alternative | Platform | Install | Best for |
sips | macOS (built-in) | None | Resize, convert (no trim/OG) |
sharp | Node.js | npm install sharp | Full feature set, high performance |
ffmpeg | Cross-platform | brew install ffmpeg | Resize, convert |
Output Format Guide
| Use case | Format | Why |
| Photos, hero images | WebP | Best compression, wide browser support |
| Logos, icons (need transparency) | PNG | Lossless, supports alpha |
| Fallback for older browsers | JPG | Universal support |
| Thumbnails | WebP or JPG | Small file size priority |
| OG cards | PNG | Social platforms handle PNG best |
Core Patterns
Save with Format-Specific Quality
Different formats need different save parameters. Always handle RGBA-to-JPG compositing — JPG does not support transparency, so composite onto a white background first.
from PIL import Image
import os
def save_image(img, output_path, quality=None):
os.makedirs(os.path.dirname(output_path) or ".", exist_ok=True)
kwargs = {}
ext = output_path.lower().rsplit(".", 1)[-1]
if ext == "webp":
kwargs = {"quality": quality or 85, "method": 6}
elif ext in ("jpg", "jpeg"):
kwargs = {"quality": quality or 90, "optimize": True}
# RGBA → RGB: composite onto white background
if img.mode == "RGBA":
bg = Image.new("RGB", img.size, (255, 255, 255))
bg.paste(img, mask=img.split()[3])
img = bg
elif ext == "png":
kwargs = {"optimize": True}
img.save(output_path, **kwargs)Resize with Aspect Ratio
When only width or height is given, calculate the other from aspect ratio. Use Image.LANCZOS for high-quality downscaling.
def resize_image(img, width=None, height=None):
if width and height:
return img.resize((width, height), Image.LANCZOS)
elif width:
ratio = width / img.width
return img.resize((width, int(img.height * ratio)), Image.LANCZOS)
elif height:
ratio = height / img.height
return img.resize((int(img.width * ratio), height), Image.LANCZOS)
return imgTrim Whitespace (Auto-Crop)
Remove surrounding whitespace from logos and icons. Convert to RGBA first, then use getbbox() to find content bounds.
img = Image.open(input_path)
if img.mode != "RGBA":
img = img.convert("RGBA")
bbox = img.getbbox() # Bounding box of non-zero pixels
if bbox:
img = img.crop(bbox)Thumbnail
Fit within max dimensions while maintaining aspect ratio:
img.thumbnail((size, size), Image.LANCZOS)Optimise for Web
Resize + compress in one step. Convert to WebP for best compression. Typical settings: width 1920, quality 85.
Cross-Platform Font Discovery
System font paths differ by OS. Try multiple paths, fall back to Pillow's default. On Linux, fc-list can discover fonts dynamically.
from PIL import ImageFont
def get_font(size):
font_paths = [
# macOS
"/System/Library/Fonts/Helvetica.ttc",
"/System/Library/Fonts/SFNSText.ttf",
# Linux
"/usr/share/fonts/truetype/dejavu/DejaVuSans.ttf",
"/usr/share/fonts/truetype/liberation/LiberationSans-Regular.ttf",
# Windows
"C:/Windows/Fonts/arial.ttf",
]
for path in font_paths:
if os.path.exists(path):
try:
return ImageFont.truetype(path, size)
except Exception:
continue
return ImageFont.load_default()OG Card Generation (1200x630)
Composite text on a background image or solid colour. Apply semi-transparent overlay for text readability. Centre text horizontally.
from PIL import Image, ImageDraw, ImageFont
width, height = 1200, 630
# Background: image or solid colour
if background_path:
img = Image.open(background_path).resize((width, height), Image.LANCZOS)
else:
img = Image.new("RGB", (width, height), bg_color or "#1a1a2e")
# Semi-transparent overlay for text readability
overlay = Image.new("RGBA", (width, height), (0, 0, 0, 128))
img = img.convert("RGBA")
img = Image.alpha_composite(img, overlay)
draw = ImageDraw.Draw(img)
font_title = get_font(48)
font_sub = get_font(24)
# Centre title
if title:
bbox = draw.textbbox((0, 0), title, font=font_title)
tw = bbox[2] - bbox[0]
draw.text(((width - tw) // 2, height // 2 - 60), title, fill="white", font=font_title)
img = img.convert("RGB")Common Workflows
Logo Cleanup (client-supplied JPG with white background)
img-process trim logo-raw.jpg -o logo-trimmed.png --padding 10
img-process thumbnail logo-trimmed.png --size 512 -o favicon-512.pngPrepare Hero Image for Production
img-process optimise hero.jpg --max-width 1920 --quality 85
# Outputs hero.webp — resized and compressedBatch Process
img-process batch ./raw-images --action convert --format webp --quality 85 -o ./optimised
img-process batch ./photos --action resize --width 800 -o ./thumbnailsPipeline with Gemini Image Gen
Generate images with the gemini-image-gen skill, then process them:
# After generating with Gemini (raw PNG output):
img-process optimise generated-image.png --max-width 1920 --quality 85
# Or batch process all generated images:
img-process batch ./generated --action optimise -o ./productionDoes it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

