Layer & Selection Tools

Tools for managing layer order and element selection.

reorder_layer

Change the layer order of an element. Elements are drawn bottom to top — the last element in the array is on top.

Parameters:

Name Type Required Description
id string Yes Element UUID
action string Yes front, back, forward, backward

Actions

Action Description
front Move to the very top (drawn last)
back Move to the very bottom (drawn first)
forward Move one layer up
backward Move one layer down

Example: Bring an element to the front so it's visible on top of others:

{
  "id": "uuid-of-text-element",
  "action": "front"
}

select_element

Select an element on the canvas. This is primarily for browser sync — the web editor will highlight the selected element.

Parameters:

Name Type Required Description
id string Yes Element UUID

deselect_all

Deselect all elements.

Parameters: None

Layer Best Practices

When building a design, layer order matters:

  1. Background — Full-size rectangle at the bottom
  2. Decorative shapes — Gradients, patterns, borders
  3. Images — Photos, icons
  4. Text — Labels, titles (should be on top to be readable)

Use reorder_layer with front to ensure text is always visible, or back to push backgrounds behind everything.