# wout/svg.js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/wout-svg-js).**

11,796 stars · 1,079 forks · JavaScript · NOASSERTION

## Links

- GitHub: https://github.com/wout/svg.js
- Homepage: https://svgjs.dev
- awesome-repositories: https://awesome-repositories.com/repository/wout-svg-js.md

## Description

svg.js is a JavaScript library and vector graphics API that provides a programmatic interface for creating and modifying scalable vector graphics in the browser. It functions as a lightweight wrapper for the browser DOM to simplify the management of SVG elements and attributes.

The project serves as both a manipulation library and an animation framework, enabling the development of dynamic user interfaces and web vector animations. It covers the creation of motion and visual transitions for vector graphics to produce fluid animations.

The library's capabilities extend to vector graphic visualization, supporting the construction of interactive diagrams and data visualizations through programmatic control of SVG properties and structure.

## Tags

### Graphics & Multimedia

- [Dynamic Vector Graphics](https://awesome-repositories.com/f/graphics-multimedia/graphics-and-media/dynamic-vector-graphics.md) — Provides a programmatic interface for the real-time manipulation and modification of vector-based visual elements. ([source](https://github.com/wout/svg.js#readme))
- [Vector Animation Libraries](https://awesome-repositories.com/f/graphics-multimedia/animation-motion/vector-animation-libraries.md) — Provides tools for animating SVG paths, strokes, and coordinate systems to create fluid vector animations. ([source](https://github.com/wout/svg.js#readme))
- [Dynamic SVG Manipulation](https://awesome-repositories.com/f/graphics-multimedia/dynamic-svg-manipulation.md) — Enables real-time programmatic alteration of SVG attributes and element hierarchies.
- [CSS Animation Classes](https://awesome-repositories.com/f/graphics-multimedia/media-production-suites/animation-tools/ui-motion-frameworks/css-animation-classes.md) — Provides a system for triggering visual transitions by applying pre-defined CSS animation classes to SVG elements.
- [SVG Data Visualization](https://awesome-repositories.com/f/graphics-multimedia/svg-data-visualization.md) — Supports the programmatic generation of vector graphics for building interactive diagrams and data visualizations.
- [Web Interface Animation Libraries](https://awesome-repositories.com/f/graphics-multimedia/web-interface-animation-libraries.md) — Implements smooth visual transitions and animated graphic elements specifically for web browser environments.

### User Interface & Experience

- [Property-Based Style Mappings](https://awesome-repositories.com/f/user-interface-experience/style-props-frameworks/property-based-style-mappings.md) — Maps high-level JavaScript object properties directly to SVG presentation attributes like coordinates and colors.
- [Vector Graphics Rendering](https://awesome-repositories.com/f/user-interface-experience/vector-graphics-rendering.md) — Functions as a lightweight DOM wrapper for rendering high-fidelity visual output using scalable vector graphics.

### Web Development

- [Direct DOM Manipulation](https://awesome-repositories.com/f/web-development/direct-dom-manipulation.md) — Provides a programmatic interface for direct DOM manipulation of SVG XML attributes for high-performance updates.

### Part of an Awesome List

- [Canvas and SVG Tools](https://awesome-repositories.com/f/awesome-lists/devtools/canvas-and-svg-tools.md) — A library for manipulating and animating SVG elements.
- [Game Engines](https://awesome-repositories.com/f/awesome-lists/devtools/game-engines.md) — Lightweight library for SVG manipulation and animation.