{"id":430,"date":"2026-04-29T15:43:42","date_gmt":"2026-04-29T19:43:42","guid":{"rendered":"https:\/\/webestech.com\/farthinkai\/?p=430"},"modified":"2026-04-30T11:05:40","modified_gmt":"2026-04-30T15:05:40","slug":"layer-decomposer","status":"publish","type":"post","link":"https:\/\/webestech.com\/farthinkai\/layer-decomposer\/","title":{"rendered":"Layer Decomposer"},"content":{"rendered":"<div id=\"layer-decomposer-react-app\">\u00a0<\/div>\n<div id=\"caption\" class=\"hero-section\">\n\n<p><strong>Layers Panel (left)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Drag-and-drop to reorder layers<\/li>\n\n\n\n<li>Double-click to rename inline<\/li>\n\n\n\n<li>Toggle visibility (\ud83d\udc41) and lock (\ud83d\udd12) per layer<\/li>\n\n\n\n<li>Delete individual layers<\/li>\n<\/ul>\n\n\n\n<p><strong>Canvas (center)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Draw rectangles, ellipses, and text by clicking &amp; dragging<\/li>\n\n\n\n<li>Drag shapes to reposition them<\/li>\n\n\n\n<li>Pan with Alt+drag or middle-mouse<\/li>\n\n\n\n<li>Zoom in\/out with <code>+<\/code>\/<code>-<\/code> keys or toolbar buttons<\/li>\n\n\n\n<li>Dashed selection outline around the active layer<\/li>\n\n\n\n<li>Dot-grid background with white canvas frame<\/li>\n<\/ul>\n\n\n\n<p><strong>Properties Panel (right)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Edit X\/Y, dimensions, corner radius, font size, text content<\/li>\n\n\n\n<li>Color swatches + color picker for fill<\/li>\n\n\n\n<li>Opacity slider<\/li>\n\n\n\n<li>Stroke color + stroke width<\/li>\n<\/ul>\n\n\n\n<p><strong>Keyboard Shortcuts<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>V<\/code> \u2014 Select tool \u00b7 <code>R<\/code> \u2014 Rectangle \u00b7 <code>O<\/code> \u2014 Ellipse \u00b7 <code>T<\/code> \u2014 Text<\/li>\n\n\n\n<li><code>Delete<\/code> \/ <code>Backspace<\/code> \u2014 Delete selected layer<\/li>\n\n\n\n<li><code>+<\/code> \/ <code>-<\/code> \u2014 Zoom \u00b7 <code>0<\/code> \u2014 Reset view<\/li>\n<\/ul>\n\n\n\n<p><strong>Export<\/strong> \u2014 one-click SVG file download of all visible layers.<\/p>\n\n<\/div>","protected":false},"excerpt":{"rendered":"<p>\u00a0 Layers Panel (left) Canvas (center) Properties Panel (right) Keyboard Shortcuts Export \u2014 one-click SVG file download of all visible layers.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-430","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/posts\/430","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/comments?post=430"}],"version-history":[{"count":6,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/posts\/430\/revisions"}],"predecessor-version":[{"id":436,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/posts\/430\/revisions\/436"}],"wp:attachment":[{"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/media?parent=430"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/categories?post=430"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webestech.com\/farthinkai\/wp-json\/wp\/v2\/tags?post=430"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}