SVG.js Playground

Just a default setup to start fiddling

by Vince

HTML

<div id="drawing">
	<h1>hello world</h1>
</div>

JavaScript

// get text
var el = document.querySelector('#drawing h1');
var text = el.innerText;

el.innerText = '';

// initialize SVG.js
var draw = SVG(el)

// draw pink square


var rect = draw.rect(100, 100).fill('#f06')
draw.clip().add(rect)
draw.text(text)