This drawOn symbol effect is easy to take for granted, but it was actually a lot of work to get right. 1. SF symbols are not strokes. If you look closely at the signature, not all portions of the path are the same width. 2. Moving along the path and naively filling it would look awful! Consider filling along curves where one side of the path is shorter than the other. You want the animation to fill gracefully, but there's nothing that connects the two sides of the path. The solution was to annotate each symbol with these "railroad track" guides
Enid
@ios_dev_alb
Sep 24
SwiftUI Tip 💡 Want an SF Symbol that draws itself on? In iOS 26+, use .symbolEffect(.drawOn, isActive:).

Sep 25, 2026 · 6:33 PM UTC

9
29
777
79,362
video source and more info here: developer.apple.com/sf-symbo…
5
1,098
Sort replies: Relevant Recent Liked
Replying to @kylemacomber
this is great! 👏
3
867
Replying to @kylemacomber
I tried so hard to make a custom animated symbol for unlocking the shackle (lift and turn), but I don’t think this type of thing is quite possible yet.. I ended up doing custom draws between un/locked
Chad Etzel
@jazzychad
Jun 3
Ok, here is a hacky solution using two custom SF Symbols using .drawOn/.drawOff symbolEffect with drawing guide points on the lock shackles. better than the default?
3
4
1,452
Ya the symbol effects are generic animations that apply to all symbols, so these kinds of symbol-specific flourishes can be hard to shoehorn in
7
442
Replying to @kylemacomber
These are fantastic details! Is there a reason why those two letters were chosen for that particular symbol? Perhaps I’m biased, but they do flow together quite well! 😅
Joe Naveau@joenaveau
30 Jul 2019
An SF symbol has my initials in it! It’s meant to be!
1
2
828
Heh, that I don't have any personal knowledge of. Maybe it's "John"? Apple often uses John Appleseed as a placeholder name
3
300
Replying to @kylemacomber
There's so much that goes into making SF Symbols work so well! I love the little touches like this.
5
310
Replying to @kylemacomber @ios_dev_alb
drawOn is one of the best animations I have ever seen.
1
126
Replying to @kylemacomber
the fact that they're filled shapes and not strokes is what makes this wild
1
53
Replying to @kylemacomber
the best interactions always look like they took 10 minutes to make
1
178
Replying to @kylemacomber
@grok can it be done with icons or SVGs that are not actually SF symbols search the web in detail for any repositories or articles or evidence for this?
1
25