Arcs

p5.js Tutorials
Tutorials
/
p5.js Tutorials
/
Calling Functions
/
Arcs
Previous:
Calling Functions

Arcs

January 30, 2021

example p5.js javascript calling-functions

Click here to edit this code in the p5.js editor.

This sketch calls the arc() function to draw a circular pattern. It also uses the random() function to pick a random color for each arc.

arcs arcs arcs arcs

Remix Ideas

  • Change how many arcs are drawn on each layer. Instead of starting with two half-circles, start with 3 arcs, then go to 2 arcs. Try out different patterns to see what looks cool to you.
  • Give your arcs different sizes by changing the stroke weight.
  • Make your arcs all shades of blue.
Previous:
Calling Functions

Calling Functions Examples

Rainbow Rainbow

🌈

Blue Squares Blue Squares

A gradient of blue squares.

Circles Circles

Use circles to create an interesting pattern.

Pig Pig

Oink!

Arcs Arcs

Draw a circular pattern using the arc function.

Pumpkin Pumpkin

🎃🎃🎃

Jack-o'-Lantern Jack-o'-Lantern

🎃🎃🎃

Skull Skull

💀💀💀

Add Your Own Example Add Your Own Example

Add your own example to Happy Coding.

Comments

Happy Coding is a community of folks just like you learning about coding.
Do you have a comment or question? Post it here!

Comments are powered by the Happy Coding forum. This page has a corresponding forum post, and replies to that post show up as comments here. Click the button above to go to the forum to post a comment!