Create Pinned Tab icons for Safari 9 with Schwartz
In the latest episode of the Accidental Tech Podcast, host John Siracusa relayed the details of his quest to support Safari 9's upcoming "pinned tab" feature for his blog.
With version 9, arriving in OS X El Capitan this Fall, Safari will join other modern browsers in supporting "pinned tabs" – tabs that are permanently and conveniently positioned on the far left of a browser window as a smaller tab with a graphical icon.
Website owners can provide a custom icon to appear when their site is pinned by users by creating a 16x16 pt icon in SVG.
John recounted his attempts at creating a simple SVG icon in various Mac graphics applications, and was eventually successful, but it sounded to me like the process was more difficult than it should have been. Additionally, it sounded like a perfect job for my own Mac application, Schwartz.
Schwartz is a Mac developer tool that allows you to create vector graphics in a powerful, yet comfortable WYSIWYG environment, and then generate source code in various formats, such as SVG.
The best thing about Schwartz – and what differentiates it from other similar apps – is that the generated source code is template-based. Schwartz comes with built-in templates for generating graphics source code in Objective-C, Swift, JavaScript and SVG. But if the generated code doesn't perfectly suit your personal taste, or your coding guidelines, it's easy to add new templates to exactly match your preferred coding style, in any language you like.
Anyway, I made a little video to demonstrate how easy it is to produce SVG icons to support Safari 9's pinned tab feature using Schwartz. I hope you'll check out Schwartz and give this a try!
Relevant (yet conflicting) Documentation from Apple about Safari's pinned tab feature: