工具与笔记
工具与笔记

图片加边框

白边、黑边、彩色描边都能做,加一层留白画面会透气很多。全部处理在当前浏览器内完成,图片不会离开你的设备。

  • jpg, jpeg, png, webp, bmp
  • 免注册
  • 一次 1 张
拖拽图片到这里,或点击选择文件 支持 jpg, jpeg, png, webp, bmp
一次 1 张(重新选择会替换) · 单张最大 50MB
当前图片
尚未选择

还没有选择文件

24px
24px

四边等宽的实心描边。填 0 就只做留白、不画边框线。宽度是固定像素,不随图片大小缩放 —— 同一组参数用在 800px 和 4000px 的图上,边框的视觉粗细会明显不同。

#FFFFFF

白边最通用(贴到任何浅色背景上都成立);深色背景上的图配黑边或深灰边更稳。浅色图片配白边会「糊」在一起,这时改用浅灰(#E5E5E5)能看出边界。

0px
0px

边框与图片之间的空白。填 0 是图片紧贴边框;给 12–32 会让画面透气,像一张卡片或相框。

#FFFFFF

只在「内侧留白」大于 0 时有意义。留白与边框同色是一个整块的宽边;不同色则是「细线 + 底色」的相框效果(例如白留白 + 灰描边)。

#FFFFFF

输出 JPG 时图片自身的透明区域无法保留,会填入这个颜色。默认白色,不改的话会被写成黑块。

原图是带透明通道的 PNG 时,保持原格式才能留住透明;转成 JPG 会按「透明区底色」铺平。

就绪

处理结果

尚未开始

    处理完成后,结果会显示在这里。

    图片加边框能做什么

    • 加实心描边:四边等宽,宽度 0–200px 连续可调,颜色任意选
    • 边框内加留白:图片与边框之间留出空白,做成相框或卡片的效果
    • 留白与边框分色:白留白配灰描边这类「细线 + 底色」组合也能做
    • 批量处理:一次上传多张,同一组边框参数统一应用
    • 透明通道保留:原图是 PNG 且保持原格式输出时,透明区不会被填色

    参数怎么调

    下表列出该工具的全部可调参数与建议取值。不确定时保持默认值即可,默认值是多数场景下的稳妥选择。

    图片加边框参数说明
    参数 可选值 默认 说明
    边框宽度 0 – 200px 24px 四边等宽的实心描边。填 0 就只做留白、不画边框线。宽度是固定像素,不随图片大小缩放 —— 同一组参数用在 800px 和 4000px 的图上,边框的视觉粗细会明显不同。
    边框颜色 任意颜色 #FFFFFF 白边最通用(贴到任何浅色背景上都成立);深色背景上的图配黑边或深灰边更稳。浅色图片配白边会「糊」在一起,这时改用浅灰(#E5E5E5)能看出边界。
    内侧留白 0 – 200px 0px 边框与图片之间的空白。填 0 是图片紧贴边框;给 12–32 会让画面透气,像一张卡片或相框。
    留白颜色 任意颜色 #FFFFFF 只在「内侧留白」大于 0 时有意义。留白与边框同色是一个整块的宽边;不同色则是「细线 + 底色」的相框效果(例如白留白 + 灰描边)。
    透明区底色 任意颜色 #FFFFFF 输出 JPG 时图片自身的透明区域无法保留,会填入这个颜色。默认白色,不改的话会被写成黑块。
    输出格式 保持原格式 / JPG / PNG / WebP keep 原图是带透明通道的 PNG 时,保持原格式才能留住透明;转成 JPG 会按「透明区底色」铺平。

    适用场景

    • 给白底商品图加一圈浅灰边,避免和白色背景糊在一起
    • 把截图放进文档或幻灯片前加个边框,和正文区分开
    • 给素材统一加白边,做成成套的卡片图
    • 给深色照片加白边,做成相框式的展示图

    常见问题

    为什么加了白边反而看不出来?

    说明图片背景本身也接近白色,两者糊在一起了。把边框颜色换成浅灰(#E5E5E5 或 #D4D4D4)就能看出边界;或者反过来,给图片加「内侧留白 + 灰色细描边」的组合,边界会更清楚。

    边框会盖住图片内容吗?

    不会。边框和留白都是加在图片外圈的,输出画布会比原图更大(每边增加「边框宽度 + 留白」),原图内容一个像素都不会丢。

    加了边框之后尺寸变成了多少?

    每边各加「边框宽度 + 内侧留白」,所以总宽 = 原宽 +(边框宽度 + 留白)× 2,高度同理。处理结果里会显示产出尺寸,需要精确尺寸时对照着调参数即可。

    批量处理时边框看起来不一样粗?

    这是预期的:边框宽度是固定像素,不随图片大小缩放。队列里 800px 的图和 4000px 的图套同一条 24px 边框,大图上看起来自然细得多。如果要求视觉一致,先把这批图统一尺寸(用「图片修改尺寸」),再加边框。