SVG

Apply Viewbox from an Element #

sourceSVG = document.getElementById('source-svg')
// get viewbox data
viewBox = sourceSVG.viewBox.baseVal
// get existing
existing = document.getElementById('existing-svg')
// set viewbox
existing.setAttribute('viewBox', `${viewBox.x} ${viewBox.y} ${viewBox.width} ${viewBox.height}`)

Links #

• Using SVG | CSS-Tricks
• Method Draw online SVG editor
• Inkscape - cross-platform vector graphics software
• Change Color of SVG on Hover | CSS-Tricks
• Animating SVG path segments
• Animating an SVG Menu Icon with Segment | Codrops
• PNG to SVG (Online & Free) — Convertio
• Icon System with SVG Sprites
• SVG to PNG - Convert SVG files to PNG Online
• SVG Sprite Generator
• svg-sprite/svg-sprite: SVG sprites & stacks galore — A low-level Node.js module that takes a bunch of SVG files, optimizes them and bakes them into SVG sprites of several types along with suitable stylesheet resources (e.g. CSS, Sass, LESS, Stylus, etc.)
• Blobmaker - Make organic SVG shapes for your next design
• Generate unique SVG design assets | Haikei
• SVGOMG - SVGO's Missing GUI
• World Map | BGJar
• Create Customizable, Hi-Def, and Scalable Backgrounds
• BGJar | Free svg background image generator for your websites
• Hero Patterns | Free repeatable SVG background patterns for your web projects
• SVGeez - Free customizable SVG background patterns | Home
• Basic Pattern Repository
• Animated line drawing in SVG - JakeArchibald.com