<div class="back-container" id="test">
	
<script src='https://harbor.naker.io/back/viewer.js' data-back='{"particle":{"direction1":{"x":100,"y":100,"z":100},"direction2":{"x":-100,"y":-100,"z":-100},"life":5,"power":0.003,"texture":"https://res.cloudinary.com/naker-io/image/upload/v1566560053/star_07.png","number":2000,"colorStart":[255,255,255,0.38],"colorEnd":[92,49,70,0.37],"sizeStart":0.92,"sizeEnd":1.84},"environment":{"gradient":"radial","sensitivity":0.62,"colorStart":[0,182,228,1],"colorEnd":[93,240,216,1]}}' data-id='test'></script>
	<p>foo bar</p>
	</div>
p{z-index:1;
position:relative;
text-align:center;
font-size:5em;
font-weight:900;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.