Making A Solid Background: Making a solid color background can be done easily. Select a square shape from the Shapes tab in the left toolbar. Drag it out to fill the entire template. Click the colored circle in the left corner of the top toolbar. Choose from the color tiles, or click the text window to enter a specific hex value. This will also bring up the color picker where you can drag the crosshairs to select a new color. You can also adjust it's hue and transparency.

Color Matching between Vector images: Color matching between vector elements created in the designer is pretty easy. This would include Vector Backgrounds and Sick Designs found in Clips Arts, or Shapes. Selecting any vector element will bring up colored circles in the left corner of the top toolbar. If you have specified a fill and stroke you will see both of those colors represented by circles. Click a circle to bring up the color picker and copy the hex value of the color. You can then paste this value into any other circle for any other element to match the colors. Depending on your operating system (I'm looking at you windows) you may see RGB values instead of the #hex value displayed. In this case you may need to click the RGB value and open an advanced color picker to get it to switch to the #hex value immediately. In some cases the #hex value will not display until you close the advanced color picker. 

Color Matching between non-vector images: MAC ONLY (pretty sure) Matching the color of an imported jpeg, png, or non-vector image is a little different. Import the image that you want to color match, and arrange it on top so that it is visible (using the Layers tab, or the Adjust Layers toggle). Select the background that you have created from a vector shape, and click the magic wand tool in the top toolbar. Click the colored circle in the editor that corresponds to your background fill color. This will bring up a separate color picker mini-window. Click the X in the top right of the editor to close it and keep the color picker mini-window open. In the lower part of the color picker you will notice an eyedropper tool. Click the eyedropper icon and then mouse over any color that you want to match. Once you find your color, click it. This will bring the color into the eyedropper square in the lower left corner of the mini-window. Now, click-drag that color into any of the blank squares opposite the eyedropper icon to save it and make it available for other elements. Select the background again, click the magic wand tool, select the colored circle that represents the background fill color, and click the color that you just saved using the eyedropper tool in the mini-window. The background should now match. If you are attempting to match a vector background in the designer to the background of an imported jpeg, you may notice a ghost edge or white line. You can select the image and crop out the edge using the crop tool.

Group Elements: To group elements Shift-Click each of them and select Group Elements in the top left corner of the toolbar to move them all together. You can also select multiple objects by dragging a box around them.When they are all selected you can move them all by click-dragging with your mouse or using the arrow keys. You can still move individual elements in a group by selecting individual elements and click-dragging them, however using the arrows keys will always move the entire group, even if only one element is selected.

Ungroup Elements: Elements that are grouped will display a link icon in the right side of the top tool bar. To immediately ungroup all elements, select the entire group (shift-click each element of drag a box around all elements) and click the "ungroup" option that appears in the top tool bar.  To ungroup elements individually select one element, and click the link icon in on the right side of the top tool bar to remove it from the group.

Vectors: Shapes (in the Shape tab on the left toolbar) are vector objects that don't lose resolution as you scale them. You can also independently specify colors for fill or stroke as well as change the width of the stroke. Click the Shapes tab of this Help menu for more detail. Some Clip Art backgrounds are Vectors too.

Tiling Images: Tiling images is a trick that you can use to get cool results or get more coverage on your piece if you have an image where you like it but it does not fill the piece. Once you have in image in place, duplicate it and line them up edge to edge to create a seamless effect. You can also rotate or flip the image using the Position tool. For example: using the Clip Art "mountain sunset glow" on an MTB fender, select this image, go to the Position tool in the right corner of the top toolbar, rotate it to 90 degrees, duplicate it by pressing ctrl+d, Flip it in the Y Axis using the Position tool, and line the two images up side by side... now you will see a dark stripe down the middle with glowing edges and a fade to purple... now there is a easy place to drop text, or a vector shape over the background you created.

CLIP ARTS: Mostly all of the images you will work with to design a product for yourself can be found in the CLIP ARTS tab in the left menu.  Clicking the Clip Arts tab will bring a sub-menu with a search bar (one word search only) and a pop-out bar to see the categories (you probably see All Categories).  Click the categories bar and you will see that there categories for Photo Backgrounds, Vector Backgrounds, and Sick Designs.

Photo BGs: These are all further broken into subcategories that you can see by clicking on the main category.  All of the Photo BGs are jpeg raster images. Click to select an image, or find it in the Layers panel, and a toolbar will appear at the top of the art board. For more info on how to work with these images, see the Help tab labeled Images.

Vector BGs: These are all vector images that scale without distortion and have colors which can be edited to match whatever colors you like. Click to select a Vector, or find it in the Layers panel, and a toolbar will appear at the top of the art board. For more info on how to work with these images, see the Help tab labeled Vectors.

Sick Designs: These vector elements are all pretty sick, there are a few subcategories, and  can be edited for color and scaled without distortion.  These are objective designs that can be used on top of a background image to create a cool design.  When you click to select a Sick Design, a toolbar will appear at the top. The Help tab labeled Vectors will explain more about how to work with these elements.

IMAGES:  There is also a tab labelled "Images" in the left tool bar. The Image tab can be used to do three things:

Upload your own images:  The minimum file size is 90kb. The preferred image size should be 200kb or bigger.  If you want to use your image as a background it should be 3300x2550 at least so that you can retain image quality as you scale it.

Use stock images: Click "Resources" and Pixabay will be selected as the default option.  You can search for what you want. Try "landscape" or "flowers" or "mist" or any other single word... it does not like multi-word searches FYI. Another awesome resource for images is Unsplash - google it.  You can find amazing free images there that you can download and then upload to the design tool on your own.

Use images from your own Facebook or Instagram account: Next to the search bar you can click Pixabay in the drop-down menu to reveal the FB & IG options. Log-in to your account, allow the tool to access your images and off you go.

Working With Images:  You can upload your own Vector Logos as .svg files and manage them like any "Shapes, or Clip Arts". The designer allows most of the kinds of photo editing features that you may be used to.  Photo images from Clip Arts > Photo BGs and images that you upload using the Images tab all can be edited in the same way.  Clicking to select an image will bring up a tool bar in the top of the designer with a few icons as follows:

Filters: Clicking the Magic Wand icon will bring up a number of filters. Depending on the image they can have a profound effect on the color. Using the sliders you can further adjust Brightness, Saturation & Contrast. Click "Clear Filters" to cancel their effects.

Remove Background: Clicking the bubbling beaker that looks like a volcano will pull up the tool. For some images, notably png images with solid backgrounds, this is a very cool feature.  Use this to take away the white or black square behind an image that you would like to have a transparent background.  Use the slider to get the right effect, give it a few seconds to load the result as you slide it.

Mask: By clicking the star you can use another element of your design to create a mask over the selected image. Available elements will appear in a pop-up menu. You can use text as a mask, and instead of the text being filled with a color, it will be filled with your image. This also works with shapes (from the Shape tab) and drawings that you create (from the Drawings tab). 

Crop Image: Clicking the cropping frame brings up the crop tool that will let you crop an image. This is really useful if you have imported an image with a colored bounding box, or white line on one side of it. You can get rid of any conspicuous edges so that you can blend in an imported image with a solid color background.

Replace Image: Click the upload cloud icon and if you need to, you can select an image from your local disk to directly replace the image that you working on.

Fill Options: The paint bucket icon will bring up a tool that will allow you to fill an image with color and set the image transparency.  Filling your image kind of defeats the purpose, but you can use pre-set fills, set your own hex value, or by clicking into the hex window bring up a color picker that will let you set the color, set the hue, and set the transparency. This tool is cool if you want to set a single color background, but otherwise it's not super useful.

Arrange Layers: The overlapping boxes icon brings up a really simple +/- toggle that lets you send the image in front of or behind the other elements.  You can also do this by clicking the Layers tab in the left toolbar and dragging the layers wherever you would like them to be.

Position: The grid icon lets you lock the position of your image. You can also set the position of the image relative to the canvas.  The best way to move the image is be click-dragging with your mouse or selecting it and moving it with the arrow keys on your keyboard though.

Transforms: The slider icon lets you rotate by angle, skew by degrees, and flip the image.  You can also use the arrow icon in the corner of the images to proportionally scale it.  You can use the handles in the sides of the image bounding box to disproportionately scale it. There is also a manual rotate icon in the corner of the image bounding box.  While we are on it, the red X will delete the image, and the overlapping boxes in the other corner will duplicate the image.

Working with Vectors: Vector elements from Vector BGs, Sick Designs (in Clip Arts tab) and Shapes allow you to change their colors, add fills and stroke, change transparency, and scale without distortion. Selecting a vector element brings up a tool bar in the top of the designer with the following functions:

NOTE: any action can be undone by deselecting any selected elements and clicking the "Undo" button in the main menu of the designer next to the Help menu.

Active Colors: In the left corner of the top tool bar you will see one or more colored circles representing the active colors of the selected element. Clicking one of the circles will bring up a Fill Options menu where you will see the active color value (in #hex value or RGB depending on your operating system) and a few swatches of saved colors.  The active color can be saved by clicking the + next to the value.  The active color value can also be selected and copied to paste into the active color window of another circle. Clicking the value of the active color in the Fill Options will bring up a Color Picker where can select a range of colors, set the hue, set the transparency level, and save the color you pick to a separate pallet for later use.

Advanced SVG Editor: Clicking the Magic Wand tool will bring up the advanced editor. You will see a larger version of the selected element, and one or more colored circles representing active colors. Clicking an active color will bring up the same Color Picker described above. Depending on your operating system (eg. Mac) you may see an advanced color picker that will include an eye dropper tool that will let easily sample colors and save them for later use.

Mousing over the active element will highlight in red certain areas of the element which can be further edited. Each element is different and may have more or less areas that are available for editing.  Elements from the Shapes tab are very simple, where elements from the Sick Designs menu can be quite complex (they are sick after all).

To experiment with the Advanced Editor pick a Shape, select it, and then click the Magic Wand icon.  Mouse over the shape in the editor and notice that it is highlighted with a red halo. Click the Shape and you will see a Selection menu to the right where you can add a Fill color and add a Stroke.  Click to add a Fill and it will fill with the default color and add a colored circle to represent that fill.  Click this circle again and you will see a Color Picker picker. Click to add a Stroke, click the colored circle that appears with the default color, choose a color that contrasts with the fill color, and click OK.  Now, use the slider to increase the width of the stroke. Note that you will see the option to remove the stroke. You will also see all of the active colors represented under All Colors under the Selection Menu. Click the check mark in the upper right corner of the Advanced Editor to save changes and close the editor.

You will see your Shape with fill and stroke in the designer.  Click the colored circle representing the fill color to bring up the Fill Options and then click the numerical color value to bring up the Color Picker.  Slide the transparency slider (furthest to the right) all the way down to make the shape transparent.  Click the X to close the Color Picker and the Fill Options. This basic operation is very useful to create a nice design using vectors.

More complicated Vectors will have more colors and more active areas that can be edited using the Advance Editor.

Arrange Layers: The overlapping boxes icon brings up a really simple +/- toggle that lets you send the image in front of or behind the other elements.  You can also do this by clicking the Layers tab in the left toolbar and dragging the layers wherever you would like them to be.

Position: The grid icon lets you lock the position of your image. You can also set the position of the image relative to the canvas.  The best way to move the image is be click-dragging with your mouse or selecting it and moving it with the arrow keys on your keyboard though.

Transforms: The slider icon lets you rotate by angle, skew by degrees, and flip the image.  You can also use the arrow icon in the corner of the images to proportionally scale it.  You can use the handles in the sides of the image bounding box to disproportionately scale it. There is also a manual rotate icon in the corner of the image bounding box.  While we are on it, the red X will delete the image, and the overlapping boxes in the other corner will duplicate the image.