Toggle navigation
Sign Up
Log In
Explore
Works
Folders
Tools
Collections
Artists
Groups
Groups
Topics
Tasks
Tasks
Jobs
Teams
Jobs
Recommendation
More Effects...
JS
function drawing() { var c = document.getElementById('sky'); var ctx = c.getContext('2d'); var xMax = c.width = window.screen.availWidth; var yMax = c.height = window.screen.availHeight; var hmTimes = Math.round(xMax + yMax); for(var i=0; i<=hmTimes; i++) { var randomX = Math.floor((Math.random()*xMax)+1); var randomY = Math.floor((Math.random()*yMax)+1); var randomSize = Math.floor((Math.random()*2)+1); var randomOpacityOne = Math.floor((Math.random()*9)+1); var randomOpacityTwo = Math.floor((Math.random()*9)+1); var randomHue = Math.floor((Math.random()*360)+1); if(randomSize>1) { ctx.shadowBlur = Math.floor((Math.random()*15)+5); ctx.shadowColor = "white"; } ctx.fillStyle = "hsla("+randomHue+", 30%, 80%, ."+randomOpacityOne+randomOpacityTwo+")"; ctx.fillRect(randomX, randomY, randomSize, randomSize); } } drawing();
CSS
html, body { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; } #sky { background: -webkit-linear-gradient(#00111e 30%, #033d5e); background: -moz-linear-gradient(#00111e 30%, #033d5e); background: -o-linear-gradient(#00111e 30%, #033d5e); background: linear-gradient(#00111e 30%, #033d5e); overflow: hidden; }
HTML
<canvas id="sky"></canvas>
Join Effecthub.com
Working with Global Gaming Artists and Developers!
Login
Sign Up
Or Login with Your Email Address:
Email
Password
Remember
Or Sign Up with Your Email Address:
Your Email
This field must contain a valid email
Set Password
Password should be at least 1 character
Stay informed via email
