DESIGN by CODE

Symmetry

Watch the design constantly change as you move your cursor across the sketch.  Move horizontally, vertically, round in circles, or keep it random.

You can edit the code to change how it looks.  

For ideas to try look for the  ▶ icon or the highlighted '//try' sections.  For example you can change:

or anything else that you choose!

Simply make the change to the code and press Run. 

Want to go back to the original code? Easy, just press Reset.

🌟🌟🌟 Move your cursor over the sketch 🌟🌟🌟

Thanks to the p5.js community for the p5.js library (p5js.org) that runs the sketch in this editor.  Note: The code in this editor is provided 'as is' for educational use only.

Learn more on YouTube

Create this design from scratch!

Learn more about color in p5.js

Video thumbnail

Other designs to try

Newsletter - Latest from Design by Code

Join the newsletter

Creating designs with code

Receive the latest designs and exclusive resources direct to your inbox.

We respect your privacy. Unsubscribe at any time.