Trangram

Trangram is a browser-based vector animation editor that combines shape manipulation with motion graphics capabilities in a free, accessible package requiring no installation or subscription. The platform handles the full workflow from initial design through final animation export without requiring desktop software purchases or complex licensing agreements. Users create and manipulate vector shapes directly in the editor, then animate them with keyframes, easing functions, and specialized motion effects. Shape morphing allows smooth transitions between entirely different forms, making it possible to animate a circle transforming into a star or a simple icon evolving into a complex illustration. Motion paths guide objects along specified trajectories with precise control points, enabling sophisticated movement that follows curves, spirals, or any custom path rather than limiting animation to simple point-to-point translation.

The shape manipulation toolkit provides comprehensive vector editing capabilities within the animation environment. Corner rounding includes multiple styles ranging from standard round corners through inverted round effects to chamfered cuts, giving designers control over shape character beyond basic circles and rectangles. Boolean operations combine shapes through unite, subtract, intersect, and exclude operations, enabling complex forms built from simpler geometric primitives. A logo designer might start with basic shapes and use boolean operations to carve negative space or merge elements. These tools provide the foundation for creating the vector artwork that subsequently gets animated, keeping the entire production pipeline within a single application rather than requiring export and import cycles between separate design and animation tools that often introduce format conversion problems.

Animation controls extend well beyond basic keyframing to include specialized capabilities that address common motion graphics needs without workarounds. Trim Path creates self-drawing animations where line segments gradually reveal or erase themselves over time, popular for logo animations, signature effects, and text reveals that look hand-drawn. Parent linking establishes hierarchical relationships where child objects automatically follow parent transformations, simplifying character animation where a hand follows an arm and joints maintain their relationships during movement. Mechanical motion, where gears or levers connect, also benefits from parent linking rather than manually synchronizing every component. Looping modes include Cycle for standard repetition that restarts from the beginning, Ping Pong for seamless back-and-forth motion without visible jump cuts, and Continue for animations that maintain momentum past their defined keyframes into free motion.

Easing functions control velocity curves, determining whether motion accelerates smoothly, decelerates into a soft stop, bounces at the end, or follows custom timing patterns. The difference between professional-looking animation and amateur motion often comes down to easing selection rather than the motion itself. Trangram provides standard options like ease-in, ease-out, and ease-in-out alongside more expressive presets for bouncy, elastic, or snappy motion.

Clipping masks function as stencils that reveal only specific portions of underlying objects, enabling reveal effects where content appears to emerge from behind shapes, viewport-style animations where characters walk past windows, and creative masking effects common in explainer videos. Number animation handles counting sequences with customizable formatting, serving dashboard visualizations where numbers animate to their final values and infographic animations that bring statistics to life. Group animation organizes multiple objects for coordinated movement without manually synchronizing individual element timelines, useful when a collection of items should enter, exit, or transform together.

Import support covers SVG files from any vector editor and the native TG project format for continuing previous work. Export options span video formats including MP4 and WebM at various quality settings, animated GIFs for web embeds and social media posts where video might not play automatically, static image formats including PNG, JPG, WebP, and SVG for frame exports or poster images, plus TG project files for local backup and later editing sessions. This format flexibility accommodates various distribution channels from YouTube and Vimeo to website embeds to social media posts across platforms with different format preferences.

The platform targets designers, animators, and motion graphics creators seeking capable animation tools without the steep learning curve and subscription cost of After Effects or the purchase price of Motion. Running entirely in the browser eliminates installation friction and ensures cross-platform compatibility wherever a modern browser runs. Tutorial content and community channels through YouTube, Reddit, and email support help users develop proficiency with the toolset beyond basic experimentation. For anyone creating animated graphics for social content, presentations, web interfaces, or video projects, Trangram provides professional-grade capabilities at zero cost with zero installation requirements.