[00:00] All components created with the drawing tools will have fill and stroke properties we can configure. To demonstrate this, I have already created a rectangle component on my window, and it is currently selected by my selection tool, which will give us access to the fill and stroke properties. These properties are available in our vision property editor on the left hand side of the designer. Let's begin working with the fill paint property, by clicking on the pencil icon. A pop-up menu appears allowing us to choose the background color for the rectangle. We can use the wheel to set our background color to a dark green by dragging the marker on the outer circle and setting it to our desired color, and we can confirm the shade by clicking within the triangle. Additionally, we have access to change the background color with the palette tab or by specifying RGB and HSL values. Let's close the popup and take a look at the stroke style property, which can be used to alter the border of the rectangle. First, we will click on the pencil icon and increase its width to 40 pixels.

[01:03] Next, let's change our solid border to a dash pattern. The cap style will change the appearance of each dash. The join style changes the appearance of a dash wrapping around the corner. And finally, the miter limit lets us control the sharp angle join. Let's click off the popup and review the stroke paint property. Again, we'll click on the pencil icon. The stroke paint property will update the color of our rectangles border and it's configured in the same way as the fill paint property. Let's go back to our wheel and choose a blue coloring for our border. Now we know how to access and use stroke and fill properties available for our components made with the drawing tools.