macSVG: an open-source free HTML5 and SVG animation designer

macSVG is a MIT-licensed open-source macOS application for designing and editing Scalable Vector Graphics (SVG) content for HTML5 web pages, mobile apps, animation design, and general graphics usage.

SVG is an open-source format for computer graphics documents based on the authoritative Scalable Vector Graphics (SVG) 1.1 (Second Edition) – W3C Recommendation 16 August 2011 from the World Wide Web Consortium (W3C), and is supported on most modern web browsers, and many application frameworks.

macSVG can produce dynamic, high-quality graphics and animation for HTML5 web views that can be displayed on most major desktop and mobile platforms, including iOS, Android, macOS, Microsoft Windows and Linux. This video shows an example of SVG animation in macSVG:

Features

• An open-source app with permissive MIT licensing terms.
• WebKit-based user interface, including the Web Inspector.
• Outline view of SVG XML document structure. Elements can be imported and reordered in the structure with drag-and-drop actions.
• SVG multi-segment path editing, with support for text on a path, path shape animation, and other path functions.
• Plug-in architecture for adding new custom editors for SVG elements and attributes. Current plug-ins can assist users in setting attribute values such as colors, color gradients, patterns, transforms, text paths, animation, path shape animations, etc.
• JPEG and PNG images can be embedded in the SVG document, or referenced externally with a URL. SVG documents can contain embedded SVG documents.
• Support for Google Web Fonts and TrueType fonts.
• A visual timeline graph for SMIL animation, with pause, play and restart controls. The time marker can be dragged (i.e., scrubbed) on the timeline to see the state of the animation at any point in time.
• The SVG XML DTD is used to comply with SVG document rules, and provide convenient menus for setting predefined attribute values.
• The built-in HTTP server provides instant live previews on other clients and devices, such as desktop web browsers, mobile devices, the iPhone/iPad Simulator, other PCs on the local network, etc.
• Convert SVG graphics to native code for iOS and macOS with the Core Graphics code generator.
• Network support for SFTP transfer of SVG document files.
• Export SVG animation to MPEG-4 for HTML5 web video.