{"id":9123,"date":"2021-11-22T03:33:00","date_gmt":"2021-11-22T10:33:00","guid":{"rendered":"https:\/\/www.yola.com\/blog\/?p=9123"},"modified":"2022-09-06T06:16:25","modified_gmt":"2022-09-06T13:16:25","slug":"design-automation-custom-color-palettes","status":"publish","type":"post","link":"https:\/\/www.yola.com\/blog\/design-automation-custom-color-palettes\/","title":{"rendered":"Design automation: Custom color palettes"},"content":{"rendered":"\n<p>Keeping up with our mission of empowering SMBs to create stunning websites with limited technical knowledge, we&#8217;re thrilled to announce another exciting new feature utilizing&nbsp;design automation:&nbsp;custom color palettes. This release gives your customers the ability to set their own color scheme, automatically adjusting fonts and buttons, ensuring content legibility always stays intact.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/Intro.gif\"><img loading=\"lazy\" width=\"500\" height=\"313\" src=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/Intro.gif\" alt=\"\" class=\"wp-image-9124\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>When designing custom color palettes, end-users have four properties available to adjust:\u00a0<\/p>\n\n\n\n<p><strong>Primary color<br><\/strong>Color property used to define buttons and call-to-action backgrounds<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/primary.gif\"><img loading=\"lazy\" width=\"500\" height=\"313\" src=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/primary.gif\" alt=\"\" class=\"wp-image-9125\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Secondary color<br><\/strong>Color property used to define background overlays, icons, links, and phone numbers<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/secondary.gif\"><img loading=\"lazy\" width=\"500\" height=\"313\" src=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/secondary.gif\" alt=\"\" class=\"wp-image-9126\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Dark background color<br><\/strong>Color property used to define the background of dark-colored blocks<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/dark.gif\"><img loading=\"lazy\" width=\"500\" height=\"313\" src=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/dark.gif\" alt=\"\" class=\"wp-image-9127\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Light background color<br><\/strong>Color property used to define the background of light-colored blocks<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><a href=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/light.gif\"><img loading=\"lazy\" width=\"500\" height=\"313\" src=\"https:\/\/blogcontent.yola.com\/uploads\/2022\/09\/light.gif\" alt=\"\" class=\"wp-image-9128\"\/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>As you can see, with each property customization, site content automatically adjusts, helping to ensure users have the best possible outcome, taking one\u00a0<em>big<\/em>\u00a0step out of the build process.<\/p>\n\n\n\n<p>Ready to give our automated color palettes a shot?<\/p>\n\n\n\n<div class=\"wp-container-1 wp-block-buttons\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\" href=\"http:\/\/editor.yola.com\" target=\"_blank\" rel=\"noreferrer noopener\">Build your website<\/a><\/div>\n<\/div>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Keeping up with our mission of empowering SMBs to create stunning websites with limited technical knowledge, we&#8217;re thrilled to announce another exciting new feature utilizing&nbsp;design automation:&nbsp;custom color palettes. This release gives your customers the ability to set their own color scheme, automatically adjusting fonts and buttons, ensuring content legibility always stays intact. When designing custom&hellip;&nbsp;<a href=\"https:\/\/www.yola.com\/blog\/design-automation-custom-color-palettes\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">Design automation: Custom color palettes<\/span><\/a><\/p>\n","protected":false},"author":24,"featured_media":9129,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","neve_meta_reading_time":"","_themeisle_gutenberg_block_has_review":false},"categories":[9],"tags":[1112],"_links":{"self":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/9123"}],"collection":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/comments?post=9123"}],"version-history":[{"count":2,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/9123\/revisions"}],"predecessor-version":[{"id":9180,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/9123\/revisions\/9180"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/media\/9129"}],"wp:attachment":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/media?parent=9123"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/categories?post=9123"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/tags?post=9123"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}