fix(badge): fix badge SVG generation with animated effects

[wontory]

Bug Fixes

• Fix shine animation not working on Safari/iOS by replacing gradientTransform SMIL animation with rect translate approach
• Fix blurry icons on Safari caused by SVG filter rasterization (removed glow filter)
• Improve trailing light blob connectivity (3 blobs/0.3s gap → 5 blobs/0.12s gap)
• Add XML escaping for orbit SVG text to prevent XSS injection
• Fix orbit SVG width not accommodating long text

Test plan

• Badge API endpoint (/api/badge) returns valid SVG
• Badge customization UI with real-time preview
• Shine animation works on Safari/iOS
• Icons render sharp on Safari
• Highlight toggle enables/disables animations

---

Note

Medium Risk
Changes SVG/SMIL rendering approach and removes filters, which can affect cross-browser visuals and animation behavior, but stays within isolated badge SVG generation.

Overview
Improves generated badge SVG animations and rendering consistency across browsers by reworking the shine effect to animate a skewed translating rect (instead of animating gradientTransform) and by switching the trailing-light blur from an SVG filter to CSS filter:blur().

Removes the icon glow filter (and its usage on the icon SVG) to avoid Safari filter rasterization blur, and tunes the trailing-light motion (more blobs and tighter spacing) for smoother connectivity.

^{Written by Cursor Bugbot for commit 72c21a8. This will update automatically on new commits. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
tech-stack	Ready	Preview, Comment	Feb 8, 2026 9:49pm