{"id":7509,"date":"2022-03-03T10:11:29","date_gmt":"2022-03-03T10:11:29","guid":{"rendered":"https:\/\/elementor.com\/academy\/?p=7509"},"modified":"2023-02-21T09:40:11","modified_gmt":"2023-02-21T09:40:11","slug":"create-vibrant-gradient-backgrounds","status":"publish","type":"post","link":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/","title":{"rendered":"Create Vibrant Gradient Backgrounds"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"7509\" class=\"elementor elementor-7509\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4f4f4f6 thesinglevideo elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"4f4f4f6\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-444a84e6\" data-id=\"444a84e6\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-62bd47a4 elementor-widget elementor-widget-video\" data-id=\"62bd47a4\" data-element_type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/xnhx_8M8Ovk&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-72584f74 thesinglevideoOver elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"72584f74\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-27402b4f\" data-id=\"27402b4f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4a7ddbcb elementor-tabs-view-horizontal elementor-widget elementor-widget-tabs\" data-id=\"4a7ddbcb\" data-element_type=\"widget\" data-widget_type=\"tabs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-tabs\">\n\t\t\t<div class=\"elementor-tabs-wrapper\" role=\"tablist\" >\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-1241\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-1241\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-1242\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-1242\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<div class=\"elementor-tabs-content-wrapper\" role=\"tablist\" aria-orientation=\"vertical\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-1241\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1241\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-1241\" tabindex=\"0\" hidden=\"false\"><p>In this tutorial we\u2019ll learn how to create vibrant gradient backgrounds for our websites. We\u2019ll cover best practices for styling and positioning gradients, as well as provide actionable tips on choosing gradient colors.<\/p><p>The tutorial will cover:<br \/>\u2714\ufe0e Using the Spacer widget to create gradients<br \/>\u2714\ufe0e Custom positioning gradients<br \/>\u2714\ufe0e Responsive settings<br \/>\u2714\ufe0e Using textured images in backgrounds<br \/>\u2714\ufe0e Tips for choosing colors<br \/>\u2714\ufe0e And much more!<\/p><p><a href=\"https:\/\/tutorialassets.elementor.cloud\/wp-content\/uploads\/2022\/03\/Grain_Texture.png.zip\" target=\"_blank\" rel=\"noopener\">Grain Texture background image download<\/a><\/p><p>See Also:<br \/><a href=\"https:\/\/elementor.com\/academy\/how-to-use-the-spacer-widget\/\" target=\"_blank\" rel=\"noopener\">Spacer Widget<\/a><br \/><a href=\"https:\/\/elementor.com\/academy\/elementor-responsive-101-all-you-need-to-know\/\" target=\"_blank\" rel=\"noopener\">Responsive 101<\/a> \u00a0<br \/><a href=\"https:\/\/elementor.com\/academy\/how-to-use-absolute-fixed-custom-positioning-in-elementor\/\" target=\"_blank\" rel=\"noopener\">Custom Positioning<\/a><br \/><a href=\"https:\/\/uigradients.com\" target=\"_blank\" rel=\"noopener\">UI Gradients<\/a><br \/><a href=\"https:\/\/coolors.co\/gradient-palette\" target=\"_blank\" rel=\"noopener\">Coolers<\/a><\/p><\/div>\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-1242\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1242\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-1242\" tabindex=\"0\" hidden=\"hidden\"><p>Hey there, it\u2019s Aviva from Elementor. In today\u2019s Tips &amp; Tricks we\u2019ll learn how to create colorful gradient backgrounds with Elementor to add flair to our websites.<\/p><p>And at the end of the tutorial, we\u2019ll provide tips on how to choose colors for your site, so make sure to watch till the end!<\/p><p>Gradients in backgrounds work well in hero sections, especially those that use typography as a focal point.<\/p><p>For our first example, we\u2019ll begin with a page with a dark background. I\u2019ve already added a section with a few elements.<\/p><p>Now we\u2019ll set the section\u2019s Content Width to Full width. Then, the Height to Min height,100 VH, or viewport height, so that the Section takes up the entire height of the screen. Next set the Column position to stretch so it takes up the full height of the section.<\/p><p>Later, when we position the gradients relative to the column, they will be in the same position at different viewport sizes.<\/p><p>Great, let\u2019s create our first gradient. From the widgets panel, we\u2019ll drag in a Spacer widget. Wait, the Spacer widget? To create gradients?<\/p><p>As you likely know, there are usually several ways to achieve any layout. While we could use a flat image for the background, or a combination of PNG images for the gradients, the Spacer widget:<\/p><ul><li>Allows us complete control over the gradient colors, position, and responsivity.<\/li><li>It also allows us to quickly modify these settings at any time.<\/li><li>And as a bonus, by using Spacer widgets instead of images, our website will load even faster!<\/li><\/ul><p>Ok, back to our Spacer. First we\u2019ll increase the Space, which refers to the Spacer\u2019s height. Then, in Advanced, under Background, select Gradient. We\u2019ll choose our first color, and drag the opacity slider a little to the left to make our color slightly transparent.<\/p><p>For the second color, we\u2019ll drag the opacity slider all the way to the left to set this color to be completely transparent.<\/p><p>Great. Now we\u2019ll change the Type to Radial.<\/p><p>We\u2019ll change the Location, around 70 generally works best.<\/p><p>And we have our first gradient! Time to position it.<br \/>We\u2019ll click Positioning. Set the Width to Custom and change the size. We\u2019ll choose Absolute for Position.<\/p><p>We can click and drag the Spacer anywhere on the page, to position it visually, or type in specific values for precision.<\/p><p>Great, now that we\u2019ve positioned the Spacer, let\u2019s change the stack order, so the Headings in the section will display above the gradient.<\/p><p>Starting with the first heading, we\u2019ll select it, and in Advanced, change the Z index to 2. Do the same for the other headings.<\/p><p>Next we\u2019ll duplicate the Spacer. It\u2019s now stacked underneath the Headings, so to make it easier to select, open the Navigator. Right click the Spacer, and select Duplicate. We\u2019ll double click to rename each Spacer, so we can quickly differentiate between them.<\/p><p>Now, with the second spacer selected, click the Advanced tab, and change the positioning. For this one we\u2019ll change the Horizontal Orientation to be from the Right, then adjust the offset. For the Vertical Orientation, we\u2019ll delete the offset value, which will center it vertically to the column.<\/p><p>Then in Background, we\u2019ll change the first color, and reduce its opacity, as well. Second gradient, done!<\/p><p>Time for the last one! Duplicate the Spacer, and rename it.<\/p><p>Once again, we&#8217;ll change the positioning. As well as the Background gradient.<\/p><p>Time to preview. Wow, that looks stunning!<\/p><p>Next we\u2019ll check our responsive settings. Click the responsive icon, and start with the Tablet preview.<\/p><p>We\u2019ll select this spacer, and reposition it.<\/p><p>As mentioned before, one of the advantages of using spacers to create gradients, as opposed to using a background image, is the ability to set each one&#8217;s position individually. Since these settings are responsive, as indicated by the viewport icon next to them, we have more control over their positioning on different devices.<\/p><p>Let\u2019s see how it works.As before, we can drag it around for visual placement, or type in our measurements, for precision. We\u2019ll go ahead now, and adjust this Spacers&#8217; positioning, as well. The third spacer looks great as is, so no need to adjust it.<\/p><p>Now we\u2019ll switch to Mobile preview. The size of the spacers is a bit large for this screen size, so back in Content, reduce the Space, which as you\u2019ll recall, controls the Spacer\u2019s height. We\u2019ll return to Positioning and reduce the width, as well as adjust the offsets.<\/p><p>Great. We\u2019ll go ahead now and select and update the size and positioning for each of the other spacers.<\/p><p>Perfect, all set. Let\u2019s move on to our second example, where we\u2019ll use similar gradients, this time on a light background, together with a texture, for a different look.<\/p><p>Before starting, make sure you have a textured background image uploaded to your website. You can use the one we\u2019ve provided in the description, or create your own. Just be sure to use a file with a transparent background.<\/p><p>select the spacers by holding down Command (or control on a PC). Right click copy. In a new tab, we&#8217;ll start with a page with a light colored background. We\u2019ll use a Hero section with the same settings as in our first example.Now paste the Spacers into the light page.<\/p><p>Great. Now we\u2019ll reposition them to our liking. Well add an extra gradient, by duplicating this one, and repositioning it as well.<\/p><p>Looking good! And last, but not least, we\u2019ll add a texture to the background. Select the section, and in Style, for the background, we\u2019ll select our Grain image, and set the attachment to Fixed.<\/p><p>If you\u2019d prefer for the whole page to have this background, you can do this in the Page settings instead.<\/p><p>Time to preview! Gorgeous!<\/p><p>As promised, here are some actionable tips to help select beautiful color combinations to use in gradients:<\/p><ol><li>For the background, choose a neutral color like black, white, or gray, or a color with a low saturation.<\/li><li>Try free online tools like uiGradients or Coolers to find and create striking gradients.<\/li><li>Play around with the opacity to soften colors that are overly dominant<\/li><li>Don\u2019t hesitate to use two Spacers with the same gradient.<\/li><li>Try overlapping spacers a bit, to create beautiful combinations.<\/li><li>And most importantly, have fun! Don\u2019t be afraid to experiment, with all the settings, till you get perfect results.<\/li><\/ol><p>And there you have it. Now you know how to add colorful gradients to your backgrounds to dazzle and engage your visitors.<\/p><p>So go ahead, explore the different options, and create your own vibrant gradient backgrounds. We can\u2019t wait to see what YOU come up with.<\/p><p>Thanks for watching! For more tutorials, subscribe to our Youtube channel. And don\u2019t forget to hit that notification bell.<\/p><\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Overview Transcript Overview In this tutorial we\u2019ll learn how to create vibrant gradient backgrounds for our websites. We\u2019ll cover best practices for styling and positioning gradients, as well as provide actionable tips on choosing gradient colors. The tutorial will cover: \u2714\ufe0e Using the Spacer widget to create gradients \u2714\ufe0e Custom positioning gradients \u2714\ufe0e Responsive settings [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":7510,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[4,22],"tags":[41,48],"class_list":["post-7509","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-layout","category-trending-now-selection-guides-tutorials","tag-guides-tutorials","tag-widgets"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Create Vibrant Gradient Backgrounds - Academy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Create Vibrant Gradient Backgrounds - Academy\" \/>\n<meta property=\"og:description\" content=\"Overview Transcript Overview In this tutorial we\u2019ll learn how to create vibrant gradient backgrounds for our websites. We\u2019ll cover best practices for styling and positioning gradients, as well as provide actionable tips on choosing gradient colors. The tutorial will cover: \u2714\ufe0e Using the Spacer widget to create gradients \u2714\ufe0e Custom positioning gradients \u2714\ufe0e Responsive settings [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/\" \/>\n<meta property=\"og:site_name\" content=\"Academy\" \/>\n<meta property=\"article:published_time\" content=\"2022-03-03T10:11:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-21T09:40:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Aviva Darab\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Aviva Darab\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Create Vibrant Gradient Backgrounds - Academy","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:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/","og_locale":"en_US","og_type":"article","og_title":"Create Vibrant Gradient Backgrounds - Academy","og_description":"Overview Transcript Overview In this tutorial we\u2019ll learn how to create vibrant gradient backgrounds for our websites. We\u2019ll cover best practices for styling and positioning gradients, as well as provide actionable tips on choosing gradient colors. The tutorial will cover: \u2714\ufe0e Using the Spacer widget to create gradients \u2714\ufe0e Custom positioning gradients \u2714\ufe0e Responsive settings [&hellip;]","og_url":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/","og_site_name":"Academy","article_published_time":"2022-03-03T10:11:29+00:00","article_modified_time":"2023-02-21T09:40:11+00:00","og_image":[{"width":1280,"height":720,"url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg","type":"image\/jpeg"}],"author":"Aviva Darab","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Aviva Darab","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/"},"author":{"name":"Aviva Darab","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/6ce87fcf655168e5ac55e43148a99449"},"headline":"Create Vibrant Gradient Backgrounds","datePublished":"2022-03-03T10:11:29+00:00","dateModified":"2023-02-21T09:40:11+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/"},"wordCount":1272,"publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"image":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg","keywords":["Guides and Tutorials","Widgets"],"articleSection":["Design \/ Layout","trending now selection \u2013 guides and tutorials"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/","url":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/","name":"Create Vibrant Gradient Backgrounds - Academy","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg","datePublished":"2022-03-03T10:11:29+00:00","dateModified":"2023-02-21T09:40:11+00:00","breadcrumb":{"@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#primaryimage","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/03\/Vibrant-Gradient-Backgrounds.jpg","width":1280,"height":720,"caption":"Vibrant Gradient Backgrounds"},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/academy\/create-vibrant-gradient-backgrounds\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Elementor","item":"https:\/\/elementor.com\/"},{"@type":"ListItem","position":2,"name":"Academy","item":"https:\/\/elementor.com\/academy\/"},{"@type":"ListItem","position":3,"name":"Design \/ Layout","item":"https:\/\/elementor.com\/academy\/design-layout\/"},{"@type":"ListItem","position":4,"name":"Create Vibrant Gradient Backgrounds"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/academy\/#website","url":"https:\/\/elementor.com\/academy\/","name":"Elementor Academy","description":"Page Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/academy\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/academy\/#organization","name":"Elementor Academy","alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","url":"https:\/\/elementor.com\/academy\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","width":490,"height":85,"caption":"Elementor Academy"},"image":{"@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/6ce87fcf655168e5ac55e43148a99449","name":"Aviva Darab","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/5456d642d6417c9b72a48f8fbec624cc1336f934ce83732b6fa2358ab0c31bfe?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5456d642d6417c9b72a48f8fbec624cc1336f934ce83732b6fa2358ab0c31bfe?s=96&d=mm&r=g","caption":"Aviva Darab"},"description":"Aviva is a Designer and Educator at Elementor. She\u2019s experienced in web and graphic design and enjoys sharing her knowledge with others. She stays fueled with coffee, dark chocolate, and Pinterest.","url":"https:\/\/elementor.com\/academy\/author\/user-5e36e0380be94\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7509","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/comments?post=7509"}],"version-history":[{"count":1,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7509\/revisions"}],"predecessor-version":[{"id":9317,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7509\/revisions\/9317"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media\/7510"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media?parent=7509"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/categories?post=7509"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/tags?post=7509"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}