VeeLang Circle Deep Dive! ⭕¶

Learn everything about drawing amazing circles in VeeLang

Welcome Back, VeeLang Artist! 🎨¶

You already know how to draw a basic circle:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200

But did you know that VeeLang circles can be so much more exciting? Let's explore all the amazing ways you can customize your circles!

Understanding Circle Properties 🔧¶

In VeeLang, properties are special instructions that tell the computer how to make your circle look different. Think of properties like choosing different crayons or deciding how thick to make your lines when drawing!

Property #1: Adding Colors! 🌈¶

The Simple Way: `color`¶

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having color "red"

Important: Colors must always be wrapped in double quotes like "red", not just red!

Wait... What Does "color" Actually Mean? 🤔¶

When you use color in VeeLang, you're actually setting two things at once: - The inside of the circle (called the "fill") - The outline of the circle (called the "stroke")

It's like using a crayon that colors both the inside and draws the border with the same color!

Property #2: Fill — The Inside Color! 🎯¶

Want just the inside of your circle to be colored? Use fill:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having fill "blue"

Where Does "Fill" Come From? 🖍️¶

Think about coloring books! When you fill in a shape with your crayon, you're coloring the inside part. That's exactly what fill does — it fills the inside of your circle with color!

Property #3: Stroke — The Border Color! 🖊️¶

Want to color just the outline? Use stroke:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having stroke "green"

Where Does "Stroke" Come From? ✏️¶

When you draw with a pen or pencil, each line you make is called a stroke. Artists have used this word for hundreds of years! In VeeLang, stroke means the line that goes around the edge of your shape.

Property #4: Thickness — How Thick is the Border? 📏¶

Make your circle's outline thicker or thinner:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having stroke "purple", thickness 5

The bigger the number, the thicker the line!

Property #5: Radius — How Big is Your Circle? 📐¶

Control exactly how big your circle is:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having radius 50

What's a Radius? 🤓¶

A radius is the distance from the center of a circle to its edge
A bigger radius = a bigger circle
A smaller radius = a smaller circle

Combining Properties — The Fun Part! 🎪¶

You can use multiple properties together by separating them with commas:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having fill "yellow", stroke "orange", thickness 3, radius 75

This creates a big yellow circle with a thick orange border!

All the Colors You Can Use Today! 🎨¶

See the full list of supported named colors and formats in the Full Colors Reference.

Basic Colors Everyone Knows¶

"red", "blue", "green", "yellow", "purple", "orange"
"black", "white", "gray", "brown", "pink"

Fun Color Names¶

"hotpink", "lime", "gold", "silver", "coral"
"turquoise", "violet", "crimson", "indigo"

Colors That Sound Like Foods¶

"peachpuff", "chocolate", "wheat", "tomato", "salmon"
"papayawhip", "lemonchiffon", "bisque", "moccasin"

Colors Named After Nature¶

"forestgreen", "seagreen", "skyblue", "snow", "ivory"
"lavender", "mintcream", "ghostwhite", "azure"

Fun Circle Examples to Try! 🎯¶

A Sunny Circle¶

// Default canvas: 800 wide, 600 tall, white
draw circle at 150,150 having fill "yellow", stroke "orange", thickness 4, radius 60

An Ocean Bubble¶

// Default canvas: 800 wide, 600 tall, white
draw circle at 300,200 having fill "lightblue", stroke "navy", thickness 2, radius 40

A Magical Purple Circle¶

// Default canvas: 800 wide, 600 tall, white
draw circle at 250,250 having fill "mediumpurple", stroke "indigo", thickness 6, radius 80

Just an Outline (No Fill)¶

// Default canvas: 800 wide, 600 tall, white
draw circle at 400,150 having stroke "red", thickness 3, radius 45

Notice: no fill property means the inside stays empty!

Color vs Fill vs Stroke — Quick Guide! 📚¶

color — Colors BOTH inside and outline. Example: veelang // Default canvas: 800 wide, 600 tall, white draw circle at 200,200 having color "red"
fill — Colors just the INSIDE. Example: veelang // Default canvas: 800 wide, 600 tall, white draw circle at 200,200 having fill "blue"
stroke — Colors just the OUTLINE. Example: veelang // Default canvas: 800 wide, 600 tall, white draw circle at 200,200 having stroke "green"

Pro Tip! 💡 You can mix and match! Use fill for the inside and stroke for a different colored outline:

// Default canvas: 800 wide, 600 tall, white
draw circle at 200,200 having fill "lightgreen", stroke "darkgreen", thickness 4

Challenge Time! 🏆¶

Try creating these circles in VeeLang:

🌟 Challenge 1: Traffic Light
Create three circles stacked vertically — red, yellow, and green
🌟 Challenge 2: Target Practice
Create a circle with a thick red outline and white fill
🌟 Challenge 3: Bubble Collection
Create several small circles with light blue fills and no outlines
🌟 Challenge 4: Rainbow Circle
Create a circle using your favorite colors from the big list above!

Artist Words in Programming! 🎨¶

VeeLang uses real words that artists have used for centuries:

Fill 🖍️ — Just like when you fill in a coloring book, fill colors the inside of shapes. Artists say "fill this area with blue" when they want to color inside the lines.
Stroke ✏️ — When artists draw lines with brushes or pens, each line is called a stroke. That's why the outline of your circle is called its stroke — it's the line that's drawn around the edge!
Thickness 📏 — Artists also talk about how thick or thin their brush strokes are. A thick brush makes thick lines, a thin brush makes thin lines. Same idea in VeeLang!

Property Rules to Remember! 📋¶

Colors must be in double quotes: "red" not red
Numbers don't need quotes: radius 50 not radius "50"
Separate multiple properties with commas: having fill "blue", radius 30
You can use properties in any order: having radius 50, fill "red" works perfectly!

What's Next? 🚀¶

Now you're a VeeLang circle expert! You know how to:

✅ Draw circles at any position
✅ Make them any size with radius
✅ Color the inside with fill
✅ Color the outline with stroke
✅ Make thick or thin outlines with thickness
✅ Use the shortcut color for both fill and stroke

In our next tutorial, we'll learn how to give shapes names, so we can use them again and again. But first, have fun experimenting with all these circle properties!

Remember: The best way to learn VeeLang is to try lots of different combinations. Don't be afraid to experiment — that's how all great programmers learn! ✨