九宫格气泡实验台

源图 · 红线就是切的地方

对比

调

slice 量的是源图像素，后面两个是页面像素。 盒子边框管气泡多胖、文字离边多远；图案宽管角上的图画多大。两个互不干扰—— 想要小气泡配大装饰，就是前者调小后者调大。

出给谁用

选 Chill 会按 #conv-screen .cv-msg-row.ai / .user .cv-bubble 出选择器， 并把原来的底色、描边、圆角、投影一并清掉。

填了就用这个地址；留空就把图压成 webp 内嵌成 data URL，断网也在。

CSS · 可以直接改

改一个字上面立刻变。想加圆角、阴影、背景色都行，这段就是真样式。 注意：拖上面的滑块会把这段重写掉。

三条要记住的

一、fill 别漏。不写中间那块是透明的，只剩一个框。上面开关自己切一下看。
二、角上的装饰别跨到边中间。边是拿来拉的，跨过去就被抻长。
三、花边/波浪边用 round，纯色渐变边用 stretch；repeat 会在边缘切半个花，基本别用。