图片缩略图

图片缩略图是什么？

图片缩略图是较大图像的缩小版本，通常用于在不加载完整分辨率文件的情况下快速预览内容。缩略图出现在文件浏览器、相册、视频预览、电商商品列表、搜索结果、社交媒体信息流和内容管理系统中。通过将最长边缩小到 64、128、256 或 512 像素并保持原始宽高比，缩略图在保持源图像视觉本质的同时，文件体积通常只有原图的 1%–10%。

缩略图对网页性能和用户体验至关重要。一个典型的商品页或图库可能同时显示数十张图片；如果每张都以原分辨率加载，页面将极其缓慢并消耗大量带宽。通过按实际显示尺寸生成缩略图，你能降低页面体积、加快加载速度、降低 CDN 和托管成本，并改善 Core Web Vitals 得分。这款缩略图生成器完全通过 Canvas API 在浏览器中完成缩放——无需上传、无需注册，除缩放本身外不会有质量损失。

等比例缩放解析

本工具按等比例缩放图片，即始终保留宽高比，图片不会被拉伸或挤压。无论图片的宽或高哪一边更长——都会变为你选择的目标尺寸；另一边则按比例计算以保持原始比例。例如，将一张 1920×1080 的横版照片设置为 256 px 缩略图，结果将是 256×144；将 1080×1920 的竖版照片设置为 256 px，结果将是 144×256。下表展示了不同源比例如何映射到常见缩略图尺寸。

源比例	示例	256 px 缩略图
16:9 横版	1920×1080	256×144
4:3 横版	1600×1200	256×192
1:1 正方形	1080×1080	256×256
3:4 竖版	1200×1600	192×256
9:16 竖版	1080×1920	144×256

等比例缩放几乎适用于所有缩略图场景，因为它保留了源图像的构图。如果需要无视源比例得到精确像素尺寸（这会拉伸图像），请使用专门的图片缩放工具。

该选哪个缩略图尺寸？

合适的缩略图尺寸取决于显示位置和用户需要看到的细节多少。极小缩略图适用于网格和总览图；中等尺寸适用于卡片和列表；较大的缩略图适用于主视觉预览和商品详情。使用在显示尺寸下仍能接受的最小尺寸——这样能将文件体积降到最低，性能提升最大。

• 64 px — 文件浏览器图标、总览图、高密度网格。仅需图像轮廓时适用。
• 128 px — 搜索结果、社交媒体头像、评论缩略图。尺寸与细节的良好平衡。
• 256 px — 商品卡片、图库缩略图、博客文章特色图。多数网页缩略图的默认选择。
• 512 px — 较大预览图、Open Graph 图、社交分享预览、Retina 卡片。
• 自定义 — 当你有精确显示尺寸目标时使用，如 300×300 用于特定网格单元。

何时需要使用缩略图生成器

生成缩略图是图片密集型网站和应用中收益最高的优化之一。常见场景包括：

• 电商店铺。 为快速加载分类页生成小商品卡片缩略图，仅在商品详情页加载高分辨率图。
• 相册与作品集。 显示链接到原分辨率图片的缩略图网格，显著降低初始页面体积。
• 内容管理系统。 为上传的媒体预生成缩略图，让 CMS 能为不同场景提供合适尺寸。
• 博客和新闻站。 为文章列表页和 RSS 订阅源创建特色图缩略图以加快加载。
• 搜索与目录站。 在每条结果旁显示小预览缩略图，便于快速视觉扫描。
• 移动应用。 提供缩略图以减少移动网络流量并改善滚动性能。

如何生成缩略图

用这款工具生成缩略图只需几秒，完全在浏览器中完成。无需上传、无需注册、无需安装。按以下步骤操作：

1. 上传图片。 拖拽 PNG、JPG、WebP、GIF 或 BMP 文件，或点击浏览选择。
2. 选择缩略图尺寸。 选择 64、128、256、512 像素，或选择"自定义"输入具体像素值。
3. 选择输出格式。 PNG 保留透明，JPG 适合照片，WebP 文件最小。
4. 生成。 点击"生成缩略图"，工具会通过 Canvas API 等比例缩放图片并显示原始与缩略图体积对比。
5. 下载。 点击"下载缩略图"，文件名会在原名后加上 _thumb 后缀。

由于所有步骤都通过 JavaScript 和 Canvas API 在本地运行，源图片不会离开你的浏览器。这使工具完全私密、快速，并适合敏感或未发布的图像。