[{"data":1,"prerenderedAt":167},["ShallowReactive",2],{"help-article-\u002Fhelp\u002Fdesign-elements-and-tools\u002Fdesign-tools":3},{"id":4,"title":5,"body":6,"category":155,"description":156,"extension":157,"keywords":158,"meta":159,"navigation":160,"order":161,"path":162,"seo":163,"stem":164,"updated":165,"__hash__":166},"help\u002Fhelp\u002Fdesign-elements-and-tools\u002Fdesign-tools.md","Design tools (zoom, align, scale, move)",{"type":7,"value":8,"toc":148},"minimark",[9,18,23,26,30,33,55,58,61,86,96,103,107,122,143],[10,11,12,13,17],"p",{},"The ",[14,15,16],"strong",{},"Toolbar"," holds the tools for getting around your design and sizing elements precisely.",[19,20,22],"h2",{"id":21},"zoom","Zoom",[10,24,25],{},"Use the zoom dropdown in the Toolbar to set the zoom level, from 50% up to 200%. Zoom in to work on detail, or out to see the whole canvas.",[19,27,29],{"id":28},"cursor-modes","Cursor modes",[10,31,32],{},"The cursor dropdown changes what dragging on the canvas does:",[34,35,36,43,49],"ul",{},[37,38,39,42],"li",{},[14,40,41],{},"Select"," (the default): click an element to select it, drag to move it, and drag its handles to resize its bounding box.",[37,44,45,48],{},[14,46,47],{},"Canvas Drag",": pan around the canvas. You move your view, not the elements.",[37,50,51,54],{},[14,52,53],{},"Scale",": scales elements proportionally (see below).",[19,56,53],{"id":57},"scale",[10,59,60],{},"Scale is the most useful tool to understand, especially for text.",[10,62,63,64,66,67,70,71,74,75,77,78,81,82,85],{},"In ",[14,65,41],{}," mode, dragging a handle resizes the ",[14,68,69],{},"bounding box"," (its size and position), but it leaves the element's intrinsic properties alone. For a text element, the ",[14,72,73],{},"max font size"," doesn't change. ",[14,76,53],{}," changes those too: the ",[14,79,80],{},"font size"," of text and the ",[14,83,84],{},"stroke width"," of shapes scale together with the element. For text especially, this is the reliable way to land on the size you want.",[10,87,88,89,91,92,95],{},"You can scale in two ways: switch the cursor to ",[14,90,53],{},", or hold ",[14,93,94],{},"Shift"," while dragging a handle.",[10,97,98],{},[99,100],"img",{"alt":101,"src":102},"","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fc4e88265-9918-4529-1e39-2e7031387000\u002Fmax",[19,104,106],{"id":105},"align","Align",[10,108,109,110,113,114,117,118,121],{},"Align positions the selected element with one click. It becomes available once you have a selection, with options to ",[14,111,112],{},"Center horizontal",", ",[14,115,116],{},"Center vertical",", or align ",[14,119,120],{},"Relative to top \u002F right \u002F bottom \u002F left",".",[34,123,124,134],{},[37,125,126,127,130,131,121],{},"With ",[14,128,129],{},"one element"," selected, it aligns relative to the ",[14,132,133],{},"canvas",[37,135,126,136,139,140,121],{},[14,137,138],{},"several elements"," selected, they all align relative to the ",[14,141,142],{},"last one you selected",[10,144,145],{},[99,146],{"alt":101,"src":147},"https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002F8811ecd5-fced-4388-b0f9-046b35f05d00\u002Fmax",{"title":101,"searchDepth":149,"depth":149,"links":150},2,[151,152,153,154],{"id":21,"depth":149,"text":22},{"id":28,"depth":149,"text":29},{"id":57,"depth":149,"text":53},{"id":105,"depth":149,"text":106},"design-elements-and-tools","Navigate your design and size elements precisely with the zoom, canvas drag, scale, and align tools.","md",[],{},true,30,"\u002Fhelp\u002Fdesign-elements-and-tools\u002Fdesign-tools",{"title":5,"description":156},"help\u002Fdesign-elements-and-tools\u002Fdesign-tools","2026-06-12","2ksJ1QG3PMhHtdbaFEx7KxiVXSa4jh0fbvN_HV7p51M",1787923688687]