Tooltip: Delete Active Layer
What it does:
Removes the selected image/object from the canvas.

How to use:

• Select the object you want to remove.

• Click the Trash icon — the layer is deleted immediately.

🔒 Lock Active Layer

Tooltip: Lock Active Layer
What it does:
Prevents the selected object from being moved, resized, or edited.

How to use:

• Select the object.

• Click the Lock icon. A locked object can't be selected again unless unlocked.

🔐 Lock All Objects

Tooltip: Lock All Objects
What it does:
Locks every object on the canvas at once.

How to use:

• Click the Lock All icon. Nothing can be edited until manually unlocked.

🧠 Pro Tip 

💡 No Undo? No Problem.
Don’t worry about mistakes! Just select any object and delete it using the 🗑️ button. Want a backup? Use Clone before trying a new effect.

🔓 Unlock All

Tooltip: Unlock All
What it does:
Unlocks all locked objects on the canvas.

How to use:

• Click the Unlock All icon. All objects become movable/editable again.

📄 Clone the Selected Layer

Tooltip: Clone the Selected Layer
What it does:
Duplicates the currently selected object and places the copy nearby.

How to use:

• Select the object.

• Click the Clone button. A duplicate appears on the canvas.

🔝 Move Active Layer to the Top

Tooltip: Move Active Layer to the Top
What it does:
Brings the selected object to the front of the layer stack.

How to use:

• Select the object.

• Click the Move to Top icon. The object will now be visually on top of others.

🌫️ Opacity for Selected Object

Slider Tool: (No tooltip — visible range input)
What it does:
Adjusts the transparency of the selected object.

How to use:

• Select an object.

• Use the slider to change its opacity (from fully visible to invisible).

  • 1 = fully visible

  • 0 = fully transparent

🖼️ Fit Image to Canvas

Button Text: Fit Image To the Canvas
What it does:
Resizes the selected image to cover the entire canvas area.

How to use:

• Select an image or background element.

• Click this button to automatically stretch it to fit the full page size.

📥 Download Favicons (ZIP)

Tooltip: Download favicon images and HTML tags
What it does:
Creates a .zip file that includes multiple favicon image sizes, a file of meta tags to copy into your HTML, and a step-by-step instruction file.

How to use:

1. Click the Download Favicons button.
2. A .zip file will download to your computer. It contains:
   • 3 PNG images: favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png
   • favicon-meta.txt — the meta tag code to copy into your site
   • favicon-readme.txt — beginner-friendly instructions
3. Unzip the folder and follow the simple steps in the readme file.

🖼️ How to Use “Free Image Collections”

What it does:
Browse over 2,000 free-to-use PNG images, organized into themed folders (e.g., “Animals,” “Kids,” “Funny,” etc.).

How to use it:

1. Click the “Free Image Collections” button in the “Add Images” section.

2. The tools pane opens with a folder selection dropdown.

3. Choose a folder from the dropdown. The images in that folder will load below it.

4. Click on any image to add it to your canvas.

5. Adjust the image freely and apply functions like Lock, Flip, or Opacity.

Tips:

• These images are ideal for storytelling, backgrounds, or decoration.

• Switch folders anytime using the same dropdown.

📤 How to Upload Your Own Image

What it does:
This tool allows you to upload a PNG or JPG image from your device and add it directly to your current canvas. Great for personal photos, custom graphics.

How to use it:

1. Click the “Upload an Image” button in the “Add Images” section. It looks like a file icon with an upward arrow.

2. A standard file picker will open. Choose any .png or .jpg image from your device.

3. Once selected, the image is automatically placed on your active canvas.

4. From here, you can:

   • Resize, move, or rotate the image.

   • Use any available tools like Flip, Clone, Lock, or Opacity.

Tips:

• Use high-resolution images for best print or PDF quality.

• You can upload multiple images—just repeat the steps.

🔷 How to Use “Add Shapes”

What it does:
The Add Shapes tool lets you place vector-style shapes onto your canvas. Once added, you can fully customize their appearance using color, gradients, strokes, and even textures.

➕ Adding a Shape

1. From the dropdown menu, select “Add Shapes.”

2. The tools pane will open on the right and display a selection of predefined shapes (e.g., circles, stars, arrows, rectangles).

3. Click any shape to immediately add it to the current canvas.

🎨 Customizing the Shape

After adding a shape, you can:

• Change the Fill Color using the built-in color picker.

• Adjust the Stroke Width to make the outline thicker or thinner.

• Set the Stroke Color to contrast or blend with your design.

• Resize or Rotate the shape as needed.

🌈 Enhance with Other Tools

• Use the Gradient Tool to fill the shape with a multicolor gradient (up to 10 colors).

• Use the Texture Tool to overlay a seamless texture that perfectly follows the shape’s contour.

• Use the Shadow, Lock, or Clone tools from the On-Screen Tools section for additional effects.

Tips:

• Shapes are great for callouts, framing objects, or adding visual interest.

• Use gradients or textures to give flat shapes a professional look.

🌈 How to Use “Add Gradients”

What it does:
The Gradient Tool lets you apply rich, multi-color gradient fills to any selected shape or text object on your canvas. Gradients can include up to 10 customizable colors, letting you create smooth blends or vibrant rainbow effects.

🎛️ How to Apply a Gradient

1. From the dropdown menu, select “Add Gradients.”

2. The tools pane will open, showing the gradient builder interface.

3. Select the object on your canvas (either a shape or a text box) that you want to apply the gradient to.

4. Use the controls in the gradient panel to:

   • Add up to 10 color stops.

   • Adjust each stop's position and color.

   • Choose between linear or radial gradient styles (if available).

🖌️ Supported Objects

• Shapes (from the Add Shapes tool)

• Text (added using the Add Text tool)

The gradient will conform to the size and orientation of the selected object.

🔄 Live Preview

Changes apply in real-time to the selected object, so you can adjust the gradient until it looks exactly how you want.

Tips:

• Use gradients to make titles pop or give shapes a modern look.

• Combine with the Texture Tool for even more layered effects.

• Gradients do not affect images — only shape and text layers.

🔤 How to Use “Add Text”

What it does:
The Add Text tool lets you insert and style editable text elements directly on your canvas. You type and style the text in the tools pane, with all changes reflected live on the canvas. It includes advanced controls for color, stroke, shadow, and gradients — plus access to over 25 fonts, including exclusive styles like Spraypaint.

🆕 Adding Text to the Canvas

1. Select “Add Text” from the action dropdown menu in the left control panel.

2. The tools pane will open on the right.

3. Inside the tools pane, click the “Add Text” button to insert an empty text box onto the upper-left corner of the canvas.

4. The text will be blank until you type in the provided field in the tools pane.

🎯 Typing Your Text

• Do not type directly on the canvas.
  Instead, type in the input field in the tools pane.

• Text appears live on the canvas as you type, so you can see how it will look.

• Press Enter to start a new line.

• You can use the font size control to make the text larger or smaller — this is the preferred method for resizing.

⚠️ Use the canvas drag handles only for minor adjustments — major resizing should be done through the font size setting.

🛠️ Styling Options

The tool pane provides full control over text appearance:

• Font Selector: Choose from 25+ fonts, including custom ones only available in this app.

• Font Size: Adjust text size precisely.

• Fill Color: Set the main color of the text.

• Stroke Color & Width: Add an outline with customizable thickness and color.

• Shadow: Enable shadow, and adjust its blur, X/Y position, and intensity.

• Gradient Fill: Use the Add Gradient tool to apply multi-color gradient effects to the entire text block.

🧲 Positioning

• Click and drag the text box to move it anywhere on the canvas.

• Use tools like Flip, Move to Top, Lock, or Clone for additional control.

Tips:

• Always preview line breaks while typing to avoid surprise overflows.

• For bold designs, try combining stroke, shadow, and gradient for professional results.

• Text stays fully editable unless flattened via export.   

🌑 How to Use “Add Shadows”

What it does:
The Add Shadows tool lets you apply drop shadows to most canvas objects — including shapes, uploaded images, and decorative elements — to create a sense of depth and separation.

⚠️ Note:
To add shadow to text, use the Add Text tool. Text shadow is controlled from within that tool only.

🧱 Applying Shadow to an Object

1. Select “Add Shadows” from the dropdown menu.

2. The tools pane will open with shadow controls.

3. Click on an object on the canvas to apply a shadow.

4. Adjust the following settings in real-time:

   • Shadow Color

   • Shadow Blur

   • X Offset (horizontal placement)

   • Y Offset (vertical placement)

   • Opacity (if available)

🧾 Supported Object Types

• Shapes (from Add Shapes)

• Uploaded images

• Any layer except text (use the Add Text tool for that)

💡 Pro Trick: Multi-Directional Shadows

Want your object to cast shadows in more than one direction? Try this:

1. Select the object and click Clone.

2. Drag the cloned version directly on top of the original (center it).

3. Change the shadow offset X/Y on the clone to a different direction.

4. Result: a layered shadow effect that casts in two directions.

Repeat with more clones to create dramatic depth effects.

Tips:

• Subtle blur and offset values create softer, more realistic shadows.

• High contrast shadows work well for sticker or cutout-style designs.

🎨 How to Use “Paint/Draw”

What it does:
This tool lets you switch between Spray Paint and Pencil Drawing modes. You can use either to decorate pages, add textures, or sketch freehand elements. Both modes offer full control over color, intensity, and brush size — and include an Undo button.

🔫 Spray Paint Mode

Use this to apply textured, airbrush-like coloring effects.

Controls:

• Color Picker: Choose your paint color.

• Density: Controls how intense or concentrated the paint looks.

• Radius: Controls the spray spread (larger = softer, wider spray).

• On/Off Toggle: Click the button to enable or disable spray painting.

• Undo Last Spray: Removes the most recent paint action.

How to use:

1. Select “Paint/Draw” from the dropdown menu.

2. In the tools pane, adjust the spray paint settings.

3. Click “Turn Spray Paint On” to begin painting directly on the canvas.

4. Click again to turn it off when done.

✏️ Pencil Drawing Mode

Use this to sketch lines, outlines, or freeform shapes.

Controls:

• Color Picker: Choose your line color.

• Line Width: Set how thick your pencil lines should be.

• On/Off Toggle: Switches drawing mode on and off.

• Undo Last Stroke: Removes the last pencil line drawn.

Shape-Filling Trick:

• Draw a closed shape using the pencil tool.

• Once done, turn off drawing mode.

• You can now use Add Gradient or Add Shapes to fill the drawn area just like a standard shape.

• This allows for completely custom shapes with advanced styling.

🧠 Auto-Safety Feature

• Switching between Spray, Pencil, or any other tool will automatically turn off painting or drawing.

• This prevents unwanted marks on the canvas when you move on to other tasks.

Tips:

• Spray paint works well for adding soft shading or color bursts behind other elements.

• Pencil outlines + gradient fills = totally unique custom shapes.

• Undo quickly if a stroke goes wrong — no need to start over.

🎨 How to Use “Paint/Draw”

What it does:
This tool gives you two creative modes: Spray Paint and Pencil Drawing. You can paint soft textures or draw clean lines directly on the canvas. Both modes support full control over color, size, and opacity — and include Undo buttons for easy corrections.

🔫 Spray Paint Mode

Creates a soft, scattered paint effect ideal for shading or background texture.

Controls:

• Color Picker – Select your paint color.

• Density – Controls how concentrated the paint is.

• Radius – Controls the spread (spray size).

• On/Off Toggle – Enables or disables spray mode.

• Undo Last Spray – Reverts the last spray action.

✏️ Pencil Drawing Mode

Creates clean, continuous lines or outlines of shapes.

Controls:

• Color Picker – Choose your line color.

• Line Width – Set the thickness of the pencil.

• On/Off Toggle – Turns drawing mode on or off.

• Undo Last Stroke – Removes the most recent pencil mark.

🎯 Custom Shape Fill Trick

1. Use the Pencil to draw a closed shape.

2. Turn off drawing mode.

3. Now apply a gradient or texture — it will behave like any other shape.

This lets you create totally unique, freeform shapes and fill them with vibrant designs.

🧱 Post-Drawing Object Control

Once you turn off Spray or Pencil mode, anything you've drawn or painted becomes a canvas object that you can:

• Move

• Resize

• Rotate

• Delete

Just like any other layer.

🌫️ Opacity Control

• After selecting a paint or pencil object, use the Opacity Slider in the Controls Pane to adjust transparency.

• Lower opacity can create light shadows, layered paint effects, or blended lines.

🧠 Auto-Off Protection

Switching tools (or switching between Spray and Pencil) automatically disables painting/drawing, preventing unwanted marks.

Tips:

• Combine soft spray backgrounds with sharp pencil outlines for contrast.

• Use light opacity to build up shading in layers.

• Undo is your best friend when exploring styles — don’t hesitate to try something wild.

🧪 How to Use “Filters”

What it does:
The Filters tool lets you apply advanced visual effects like grayscale, sepia, blur, and color adjustments — but it only works on image-based objects such as uploaded PNGs or JPGs and image collection elements.

⚠️ Important:
Filters do not work on:

• Text

• Shapes

• Drawings (pencil or spray)

• SVG-based elements like frames and corners

✅ What You Can Apply Filters To

• Uploaded images (PNG or JPG)

• Image elements from:

  • Free Image Collections

  • Alphabet Sets (if stored as PNGs)

❌ What Filters Do Not Work On

• Text (use the text tool for styling)

• Shapes (use color/gradient/texture instead)

• Drawings (use opacity + fill effects instead)

• Frames/Corners (SVG-based, not compatible with filters)

🎛️ Using the Filters Tool

1. Select “Filters” from the dropdown menu.

2. The tools pane will load the full list of filter options.

3. Select an image on the canvas to activate the filter controls.

4. Use the checkboxes and sliders to apply real-time effects.

🔌 WebGL

• Keep “Use WebGL” enabled for better performance and more advanced filter processing.

• Only disable if you're on a very slow or incompatible device.

🎨 Filter Categories

Tone and Color Adjustments

• Grayscale (Average, Lightness, Luminosity)

• Invert

• Sepia

• Black & White

• Vintage, Kodachrome, Technicolor, etc.

Selective Color Removal

• Pick a color to remove and adjust sensitivity with Distance.

Image Corrections

• Brightness

• Contrast

• Saturation

• Vibrance

• Hue

• Gamma (control Red, Green, Blue separately)

Stylized Effects

• Noise

• Pixelate

• Blur

• Sharpen

• Emboss

Blending

• Blend a color using modes like Multiply, Overlay, Screen, etc.

• Adjust blend color and opacity (alpha).

🔄 Real-Time Feedback

• All changes update instantly on the selected image.

• Multiple filters can be layered for complex effects.

Tips:

• Use Pixelate + Contrast to create poster art.

• Combine Hue, Vibrance, and Gamma for dramatic tone shifts.

• Apply filters before layering text, frames, or shapes.

🟥 How to Use “Colored Background”

What it does:
This tool lets you apply a solid color background to your current canvas. It's especially useful for setting the tone of a design, testing visibility, or helping you visualize layout elements like margins and overlays.

🎨 How to Add a Background Color

1. Select “Colored Background” from the dropdown menu.

2. The tools pane will open with:

   • A color picker to choose your background color.

   • An opacity slider to control how transparent the background appears.

3. Pick your color.

4. Click the add colored layer button

5. Adjust the opacity as needed to suit your workflow.

👁️ Why Use Opacity?

The opacity control lets you:

• Make the background see-through so you can align other objects or see margin lines.

• Work with a dark background while still previewing how other elements sit on top.

• Reduce opacity before exporting if needed, or set it back to full for strong color.

Tips:

• Lower the opacity while designing to reduce distractions or improve layering visibility.

• Set it back to 100% before final export for a strong, clean background.

• Use in combination with Margins to test layout balance.

💡 Tips & Tricks for Creating Pro-Level Canvas Projects

These expert techniques will help you get the most from the editor’s design tools and layering capabilities.

🎨 Gradient Overlay Effects with Cloning

Custom gradient blends using cloned shapes:

1. Fill a shape with a gradient (e.g., Diagonal 1).

2. Clone the shape using the Clone button.

3. Select the cloned shape and change its gradient to a different style (e.g., Diagonal 2).

4. Align the two shapes perfectly (use the arrow keys or drag carefully).

5. Lower the opacity of the cloned shape to blend the two gradients.

🔁 Result: A soft, multi-directional custom gradient with added depth.

🖼️ Building Pages in Stages

Use a “save and reload” workflow for structured page design:

1. Create your background (shapes, colors, spray paint, textures, etc.).

2. Use the “Save to Server” button to save this base design to a project folder of your choice.

3. Reload the editor, then insert that saved image back onto the canvas.

4. Use the “Fit to Canvas” button to stretch it to the page size.

5. Lock the background layer to protect it from edits.

6. Now add new elements (text, frames, drawings) on top without disturbing the background.

✅ This gives you a modular workflow, making it easy to reuse backgrounds or base pages across different projects.

🔐 Use Layer Locking Often

• Lock elements that are finished (like backgrounds, frames, or margins).

• Prevents accidentally moving or editing them while working on overlapping layers.

🧱 Use Drawing Tool to Create Custom Shapes

• Use the Pencil tool to draw a closed shape.

• Turn the tool off, then fill the drawn shape with gradient or texture.

• Great for stylized speech bubbles, unique borders, or abstract elements.

🧩 Mix and Match Effects for Visual Impact

Try combinations like:

• Texture over gradient (e.g., Blue fill + carbon fiber + 70% opacity)

• Shadow + blur + duplicate for soft glow effects

• Color removal filters + blend modes for dramatic image edits

🧼 Canvas Transparency

What it does:
All canvases in this editor start with a transparent background by default. That means anything not explicitly filled (with a shape, color, or background image) will remain see-through when saved or exported as a .png.

🔍 How It Works

• If you don’t use the Colored Background tool or add a full-cover image/shape, your canvas will remain transparent.

• Transparent areas are preserved when using:

  • Save to Server

  • Download PNG

• These images will maintain that transparency when opened in Photoshop or placed over other backgrounds in publishing tools.

Tips:

• This is ideal for creating stickers, cutouts, or overlay graphics.

• If you want a solid backdrop, always add a Colored Background or full-size image and use Fit to Canvas.