Excalidraw 风格手绘圆角矩形
复刻要点:自定义圆角 path、受控 roughness、自适应圆角、填充单独调参、连线避角。
参数
宽度
高度
基础 roughness
描边宽度
圆角模式
adaptive
proportional
none
填充样式
hachure
solid
cross-hatch
zigzag
dots
描边颜色
填充颜色
随机种子
换个 seed
下载 PNG
这个 demo 故意模仿 Excalidraw 的几个关键细节:
1. 圆角不是直接
roundRect
,而是拼 path。
2. 小尺寸会自动降低 roughness。
3. 箭头连接矩形时会避开角点,优先贴边。
4. 使用高 DPI canvas,避免发糊。