lucide
lucide copied to clipboard
Icons become unusable in safari due to stroke not scaling
Package
- [X] lucide
- [ ] lucide-angular
- [ ] lucide-flutter
- [ ] lucide-preact
- [ ] lucide-react
- [ ] lucide-react-native
- [ ] lucide-solid
- [ ] lucide-svelte
- [ ] lucide-vue
- [ ] lucide-vue-next
- [ ] Figma plugin
- [X] source/main
- [ ] other/not relevant
Version
0.465.0
Can you reproduce this in the latest version?
- [X] Yes
- [ ] No
Browser
- [ ] Chrome/Chromium
- [ ] Firefox
- [X] Safari
- [ ] Edge
- [ ] iOS Safari
- [ ] Opera
- [ ] Other/not relevant
Operating system
- [ ] Windows
- [ ] Linux
- [X] macOS
- [ ] ChromeOS
- [ ] iOS
- [ ] Android
- [ ] Other/not relevant
Description
When using the browser zoom in Safari with Lucide icons, the stroke width doesn't appear to scale with the size of the icon, which makes things appear incredibly distorted. This is happening both with my implementation of Lucide icons, as well as with your main site. https://lucide.dev/icons/
Steps to reproduce
- Open up Safari & view icons
- Zoom in the browser window (cmd +)
- See the icons scaling poorly
Checklist
- [X] I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)