Old school D3 from simpler times

All examples By author By category About

coakenfold

Full window Github gist

Whirlygig placard --(<>)--

<svg version="1.1" baseProfile="tiny" id="side-a" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink"
	 x="0px" y="0px" viewBox="0 0 653 638.2" xml:space="preserve">
<rect id="Box_A" fill="#B22020" width="638.2" height="638.2"/>
<path id="Preparation" fill="#070006" d="M307.3,618.5c-4-2.7-6-4-6-10s0.7-14-3.3-24s-9.3-16-9.3-22.7c0-6.7,2-26,9.3-32s4,0,5.3,0
	c1.3,0,10,25.3,10,30c0,4.7,3.3,4.7,3.3,4.7s13.3-50,15.3-55.3c2-5.3,16.7-37.3,18-42.7c1.3-5.3,14.7-26.7,17.3-30.7
	c2.7-4,6.7-15.3,9.3-15.3c2.7,0,42,23.3,47.3,27.3s52,44,55.3,47.3c3.3,3.3,3.3,3.3,3.3,3.3s8-9.3,23.3-8.7c0,0,6,9.7,4,2.8
	c-2-6.8-7.3-13.5-8.7-18.2c-1.3-4.7-1.3-9.8-1.3-9.8s-21.3-0.8-26.7-10.8c-5.3-10-4.7-27.3-4.7-27.3l-9.3,7.3l14-32.7h6
	c0,0-8.7-8-17.3-18.7c-8.7-10.7-16-41.3-16-46c0-4.7,4-8.7,6.7-9.3c2.7-0.7,14,0,14,0l2.7-6l1.3,6l10.7-2.7l5.3,2.7h10
	c0,0,15.3,4,23.3,11.3c8,7.3,16.7,14,18.7,24.7s2.7,25,0,25.5c-2.7,0.5-6,3.2-6,6.5s6.2,15.3,7.8,24c1.6,8.7,4.2,2,10.2,8
	s12.7,16,13.3,21.3c0.7,5.3,0.7,5.3,0.7,5.3s-11.3-10.7-13.3-10.7s6,6.7,5.3,16.7c-0.7,10,21.3,31.3,30.7,44.7
	c9.3,13.3,14,12.7,14,12.7s25.3,18.7,30,16c0,0,12.7,10,20,19.3c7.3,9.3-10.7,17.3-10.7,17.3S610,554.5,604,549.2
	s-29.3-25.3-29.3-25.3l2,18l10,7.3l-0.7,6.7l2,7.3l-11.3-0.7l5.3,11.3h16.7l8,20L590,613.3h-31.3l-6.7-15.4l8.7-14l-2.7-6l7.3-10.7
	l-1.3-6l-7.3,5.3l-8-12.7l2-6.7l0.7-16.7l-12,28.7l-38.7,24l-16,4.7L434,575.2l6,14.7l10.7,1.3c0,0,0.3,21.3-7.8,27.3
	c-8.2,6-31.5-5.3-31.5-5.3s8.7-12.1,7.3-18.7c-1.3-6.7-19.3-44.7-20.7-54.7s-2.7-46.7-2.7-46.7l-14-12.7c0,0,0.7,18-3.3,24.7
	s-22,21.3-26.7,28.7c-4.7,7.3-34,72.2-34,79.4S307.3,618.5,307.3,618.5z"/>
</svg>
<svg version="1.1" baseProfile="tiny" id="side-b" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink"
	 x="0px" y="0px" viewBox="0 0 638.2 657.4" xml:space="preserve">
<rect id="Box_B" fill="#B22020" width="638.2" height="638.2"/>
<path id="Execution" fill="#070006" d="M600.3,502.2l-30-49c0,0-9-45-11-51s-6-22-8-35s-13-21-13-21v-7l-6-4l-1-10
	c19,4,26-6.1,26-6.1c5,23.9,34,69.1,34,69.1s20-54,18-65s-34-26-34-26c3-15-25-37-29-41s-31-5-31-5l-8-12l-6,17l-5,3c0,0,0,0-2-3
	s-21,0-21,0c3,10,28,56,28,56v17c0,0-10-9-17-10.1c-7-1.1,5,12.1,5,12.1l-17,22l-11-2l2,8l-12,17l13,12.5l-3-7.5l10,7l12,13l-7,22
	c-13-9-39,7-39,7c-11-7-98-105-107-118s-31-25-38-45s-84-96-84-96c12-8,32-46,32-46s2-15-3-20s-17,12-22.1,12
	c-5.1,0-15.9,29-25.9,39s-25,27-23,32s32,14,32,14c3,7,41,55,47,65s13,28,19,40l37,21c3,19,92,121,92,121s5,24,9,28s17,49,19,57
	s34,111,35,118s29,7,38,0s45-63,45-63s6,37,9,44s15-5,15-5l5,16l12-6c0,0,22-38,4-47s-20-21-20-21l13-6h-6l4-11c-16-18-26-93-26-93
	l34,82L600.3,502.2z M530.1,542.2l-1.8,14c0,0,4-3,0,5s-24,22-30.5,31s-11.5,17-11.5,17c0-24-12-88-12-88c12-16,26-56,26-56l21-20
	c0,23,17,88,17,88L530.1,542.2z"/>
</svg>

<img class="img" src="https://oakenfold.ca/images/bug/TNG 150x250_3.gif" alt="" />