{"id":1223,"date":"2017-08-07T21:35:43","date_gmt":"2017-08-07T21:35:43","guid":{"rendered":"http:\/\/www.xdguru.com\/?page_id=1223"},"modified":"2020-08-18T12:57:26","modified_gmt":"2020-08-18T12:57:26","slug":"boolean-operations","status":"publish","type":"page","link":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/","title":{"rendered":"Guide – Boolean op"},"content":{"rendered":"

Combining shapes: Boolean Operations<\/strong><\/h1>\n

In Adobe XD it’s very easy to combine basic shapes in order to create more complex ones, by using the combining options located in the property inspector, also called “Boolean Operators”.\u00a0<\/span><\/p>\n

\"\"<\/p>\n

 <\/p>\n

There are 4 different boolean operators available<\/span><\/p>\n

\u2022\u00a0<\/span>Add:<\/b> The resulting object is the sum of the original 2 shapes combined<\/span><\/p>\n

\u2022 <\/span>Subtract:<\/b> The resulting object is a shape where the area of the shape on top has been cut out from the shape at the bottom<\/span><\/p>\n

\u2022\u00a0Intersect:<\/b> The resulting object is the overlapping area between the 2 shapes<\/span><\/p>\n

\u2022 <\/span>Exclude overlap<\/b>: The resulting object is basically the opposite result of the \u201cIntersect\u201d operation, where the new shape is made of the areas of the 2 shapes that do not overlap. <\/span><\/p>\n

\"\"<\/p>\n

When you combine some shapes, the result will be also reflected in the layers panel: every shape combination will represent a specific type of layer, which can be easily modified. <\/span><\/p>\n

Boolean operations are non destructive, meaning that you can always go back and change the way you combined the shapes, or even cancel the shape combination by selecting the combined layer and ungrouping it: CMD + Shift +G <\/strong>(Mac) & CTRL + Shift + G <\/strong>(Win).<\/span><\/p>\n

In some cases you might want to turn a group resulted from a boolean operation into an editable path. To do it simply go to Object > Path > Convert to Path<\/strong> or use the CMD + 8<\/strong> (Mac) & CTRL + 8<\/strong> (Win) keyboard shortcut.<\/p>\n

 <\/p>\n

PREVIOUS CHAPTER<\/a>\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0\u00a0NEXT CHAPTER<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Combining shapes: Boolean Operations In Adobe XD it’s very easy to combine basic shapes in order to create more complex […]<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":907,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"yoast_head":"\nAdobe XD boolean operations - Learn Adobe XD with XDGuru.com<\/title>\n<meta name=\"description\" content=\"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Adobe XD boolean operations - Learn Adobe XD with XDGuru.com\" \/>\n<meta property=\"og:description\" content=\"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/\" \/>\n<meta property=\"og:site_name\" content=\"XDGuru.com\" \/>\n<meta property=\"article:modified_time\" content=\"2020-08-18T12:57:26+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.xdguru.com\/#website\",\"url\":\"https:\/\/www.xdguru.com\/\",\"name\":\"XDGuru.com\",\"description\":\"Adobe XD tutorials and UI\/UX design tips\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.xdguru.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#primaryimage\",\"url\":\"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg\",\"contentUrl\":\"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#webpage\",\"url\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/\",\"name\":\"Adobe XD boolean operations - Learn Adobe XD with XDGuru.com\",\"isPartOf\":{\"@id\":\"https:\/\/www.xdguru.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#primaryimage\"},\"datePublished\":\"2017-08-07T21:35:43+00:00\",\"dateModified\":\"2020-08-18T12:57:26+00:00\",\"description\":\"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com\",\"breadcrumb\":{\"@id\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.xdguru.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Guide – Main\",\"item\":\"https:\/\/www.xdguru.com\/adobe-xd-guide\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Guide – Boolean op\"}]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Adobe XD boolean operations - Learn Adobe XD with XDGuru.com","description":"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/","og_locale":"en_US","og_type":"article","og_title":"Adobe XD boolean operations - Learn Adobe XD with XDGuru.com","og_description":"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com","og_url":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/","og_site_name":"XDGuru.com","article_modified_time":"2020-08-18T12:57:26+00:00","og_image":[{"url":"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/www.xdguru.com\/#website","url":"https:\/\/www.xdguru.com\/","name":"XDGuru.com","description":"Adobe XD tutorials and UI\/UX design tips","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.xdguru.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#primaryimage","url":"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg","contentUrl":"http:\/\/www.xdguru.com\/wp-content\/uploads\/2020\/08\/BooleanOperations1-300x136.jpg"},{"@type":"WebPage","@id":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#webpage","url":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/","name":"Adobe XD boolean operations - Learn Adobe XD with XDGuru.com","isPartOf":{"@id":"https:\/\/www.xdguru.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#primaryimage"},"datePublished":"2017-08-07T21:35:43+00:00","dateModified":"2020-08-18T12:57:26+00:00","description":"Learn how to combine shapes with boolean operations in Adobe XD. The most comprehensive guide on Adobe Experience Design, available for FREE on XDGuru.com","breadcrumb":{"@id":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.xdguru.com\/adobe-xd-guide\/boolean-operations\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.xdguru.com\/"},{"@type":"ListItem","position":2,"name":"Guide – Main","item":"https:\/\/www.xdguru.com\/adobe-xd-guide\/"},{"@type":"ListItem","position":3,"name":"Guide – Boolean op"}]}]}},"_links":{"self":[{"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/pages\/1223"}],"collection":[{"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/comments?post=1223"}],"version-history":[{"count":0,"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/pages\/1223\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/pages\/907"}],"wp:attachment":[{"href":"https:\/\/www.xdguru.com\/wp-json\/wp\/v2\/media?parent=1223"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}