{"id":89361,"date":"2021-03-22T17:52:38","date_gmt":"2021-03-22T16:52:38","guid":{"rendered":"https:\/\/undsgn.com\/uncode\/?page_id=89361"},"modified":"2021-03-22T17:52:38","modified_gmt":"2021-03-22T16:52:38","slug":"color-changer","status":"publish","type":"page","link":"https:\/\/uncode.archiformazione.it\/?page_id=89361","title":{"rendered":"Color Changer"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><p>[vc_row row_height_percent=&#8221;0&#8243; override_padding=&#8221;yes&#8221; h_padding=&#8221;2&#8243; top_padding=&#8221;5&#8243; bottom_padding=&#8221;7&#8243; back_color=&#8221;color-xsdn&#8221; overlay_alpha=&#8221;0&#8243; gutter_size=&#8221;3&#8243; column_width_percent=&#8221;100&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; bottom_divider=&#8221;gradient&#8221; changer_back_color=&#8221;yes&#8221; el_class=&#8221;demo-section demo-hero&#8221; uncode_shortcode_id=&#8221;214415&#8243; back_color_type=&#8221;uncode-palette&#8221;][vc_column column_width_use_pixel=&#8221;yes&#8221; position_vertical=&#8221;middle&#8221; align_horizontal=&#8221;align_center&#8221; gutter_size=&#8221;3&#8243; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; zoom_width=&#8221;0&#8243; zoom_height=&#8221;0&#8243; width=&#8221;1\/1&#8243; column_width_pixel=&#8221;840&#8243;][vc_custom_heading text_color=&#8221;color-210407&#8243; text_size=&#8221;fontsize-160000&#8243; el_class=&#8221;demo-subtitle&#8221;]The new scroll effect[\/vc_custom_heading][vc_custom_heading heading_semantic=&#8221;h1&#8243; text_size=&#8221;fontsize-338686&#8243; sub_lead=&#8221;yes&#8221; sub_reduced=&#8221;yes&#8221; el_class=&#8221;demo-heading&#8221; uncode_shortcode_id=&#8221;128635&#8243;]Experience the new Color Changer[\/vc_custom_heading][vc_column_text text_lead=&#8221;yes&#8221; el_class=&#8221;demo-lead-text&#8221;]With the Color Changer, it&#8217;s possible to smoothly fade your sections&#8217; background color and Skins while scrolling the page and creating a brand-new dynamic experience.[\/vc_column_text][vc_button button_color=&#8221;accent&#8221; size=&#8221;btn-lg&#8221; hover_fx=&#8221;full-colored&#8221; custom_typo=&#8221;yes&#8221; font_family=&#8221;font-377884&#8243; font_weight=&#8221;700&#8243; border_width=&#8221;0&#8243; scale_mobile=&#8221;no&#8221; link=&#8221;url:https%3A%2F%2F1.envato.market%2FQ3bJP||target:%20_blank|&#8221; el_class=&#8221;demo-button&#8221; button_color_type=&#8221;uncode-palette&#8221; uncode_shortcode_id=&#8221;651234&#8243;]Buy Now \u00b7 $59[\/vc_button][\/vc_column][\/vc_row][vc_row row_height_percent=&#8221;100&#8243; override_padding=&#8221;yes&#8221; h_padding=&#8221;2&#8243; top_padding=&#8221;7&#8243; bottom_padding=&#8221;7&#8243; overlay_color=&#8221;color-jevc&#8221; overlay_alpha=&#8221;5&#8243; gutter_size=&#8221;3&#8243; column_width_percent=&#8221;100&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; changer_back_color=&#8221;yes&#8221; uncode_shortcode_id=&#8221;734921&#8243; back_color_type=&#8221;uncode-solid&#8221; overlay_color_type=&#8221;uncode-palette&#8221; el_class=&#8221;demo-section&#8221; row_name=&#8221;Demo 1&#8243; back_color_solid=&#8221;#e53544&#8243;][vc_column column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; css_animation=&#8221;alpha-anim&#8221; animation_speed=&#8221;1000&#8243; animation_delay=&#8221;200&#8243; width=&#8221;1\/1&#8243; uncode_shortcode_id=&#8221;268537&#8243;][vc_row_inner row_inner_height_percent=&#8221;0&#8243; overlay_alpha=&#8221;50&#8243; gutter_size=&#8221;4&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; uncode_shortcode_id=&#8221;174410&#8243; limit_content=&#8221;&#8221;][vc_column_inner column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;4\/12&#8243; uncode_shortcode_id=&#8221;339524&#8243;][vc_custom_heading text_size=&#8221;fontsize-160000&#8243; el_class=&#8221;demo-subtitle&#8221; uncode_shortcode_id=&#8221;662434&#8243;]Demo 1[\/vc_custom_heading][vc_custom_heading text_size=&#8221;h1&#8243; sub_lead=&#8221;yes&#8221; sub_reduced=&#8221;yes&#8221; el_class=&#8221;demo-heading&#8221; uncode_shortcode_id=&#8221;175251&#8243;]Portfolio Freelance[\/vc_custom_heading][vc_column_text el_class=&#8221;demo-lead-text&#8221; uncode_shortcode_id=&#8221;202851&#8243;]A clean, and minimal portfolio layout that focus on the works thanks to the Colour-Changer background effect.[\/vc_column_text][vc_button size=&#8221;btn-link&#8221; custom_typo=&#8221;yes&#8221; font_family=&#8221;font-377884&#8243; font_weight=&#8221;700&#8243; scale_mobile=&#8221;no&#8221; el_class=&#8221;demo-button btn-lg additional&#8221; icon=&#8221;fa fa-chevron-right2&#8243; uncode_shortcode_id=&#8221;529885&#8243; link=&#8221;url:#|title:Portfolio%20Freelance&#8221;]View Demo[\/vc_button][\/vc_column_inner][vc_column_inner column_width_percent=&#8221;100&#8243; gutter_size=&#8221;3&#8243; style=&#8221;light&#8221; back_image=&#8221;99797&#8243; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;8\/12&#8243; uncode_shortcode_id=&#8221;200647&#8243; back_size=&#8221;100%&#8221; el_class=&#8221;image-card image-card-inverted&#8221;][vc_single_image media=&#8221;11297&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-first&#8221; uncode_shortcode_id=&#8221;635095&#8243;][vc_single_image media=&#8221;153505&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-secondary&#8221; uncode_shortcode_id=&#8221;305614&#8243;][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row row_height_percent=&#8221;100&#8243; override_padding=&#8221;yes&#8221; h_padding=&#8221;2&#8243; top_padding=&#8221;7&#8243; bottom_padding=&#8221;7&#8243; back_color=&#8221;color-rgdb&#8221; overlay_alpha=&#8221;50&#8243; gutter_size=&#8221;3&#8243; column_width_percent=&#8221;100&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; changer_back_color=&#8221;yes&#8221; uncode_shortcode_id=&#8221;859553&#8243; back_color_type=&#8221;uncode-palette&#8221; el_class=&#8221;demo-section&#8221; row_name=&#8221;Demo 2&#8243;][vc_column column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; css_animation=&#8221;alpha-anim&#8221; animation_speed=&#8221;1000&#8243; animation_delay=&#8221;200&#8243; width=&#8221;1\/1&#8243; uncode_shortcode_id=&#8221;138750&#8243;][vc_row_inner row_inner_height_percent=&#8221;0&#8243; overlay_alpha=&#8221;50&#8243; gutter_size=&#8221;4&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; uncode_shortcode_id=&#8221;174410&#8243; limit_content=&#8221;&#8221;][vc_column_inner column_width_percent=&#8221;100&#8243; gutter_size=&#8221;3&#8243; style=&#8221;light&#8221; back_image=&#8221;99798&#8243; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;8\/12&#8243; uncode_shortcode_id=&#8221;111126&#8243; back_size=&#8221;100%&#8221; el_class=&#8221;image-card image-card-triple&#8221;][vc_single_image media=&#8221;11317&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-secondary&#8221; uncode_shortcode_id=&#8221;102588&#8243;][vc_single_image media=&#8221;11300&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-first&#8221; uncode_shortcode_id=&#8221;864890&#8243;][vc_single_image media=&#8221;130300&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-secondary&#8221; uncode_shortcode_id=&#8221;964156&#8243;][\/vc_column_inner][vc_column_inner column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;4\/12&#8243; uncode_shortcode_id=&#8221;816600&#8243;][vc_custom_heading text_size=&#8221;fontsize-160000&#8243; el_class=&#8221;demo-subtitle&#8221; uncode_shortcode_id=&#8221;197773&#8243;]Demo 2[\/vc_custom_heading][vc_custom_heading text_size=&#8221;h1&#8243; sub_lead=&#8221;yes&#8221; sub_reduced=&#8221;yes&#8221; el_class=&#8221;demo-heading&#8221; uncode_shortcode_id=&#8221;214661&#8243;]Shop Landing[\/vc_custom_heading][vc_column_text el_class=&#8221;demo-lead-text&#8221; uncode_shortcode_id=&#8221;167546&#8243;]A modern shop where the Color-Changer accompanies the transition between one section and another.[\/vc_column_text][vc_button size=&#8221;btn-link&#8221; custom_typo=&#8221;yes&#8221; font_family=&#8221;font-377884&#8243; font_weight=&#8221;700&#8243; scale_mobile=&#8221;no&#8221; el_class=&#8221;demo-button btn-lg additional&#8221; icon=&#8221;fa fa-chevron-right2&#8243; uncode_shortcode_id=&#8221;874809&#8243; link=&#8221;url:#|title:Shop%20Landing&#8221;]View Demo[\/vc_button][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row row_height_percent=&#8221;100&#8243; override_padding=&#8221;yes&#8221; h_padding=&#8221;2&#8243; top_padding=&#8221;7&#8243; bottom_padding=&#8221;7&#8243; overlay_color=&#8221;color-jevc&#8221; overlay_alpha=&#8221;5&#8243; gutter_size=&#8221;3&#8243; column_width_percent=&#8221;100&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; changer_back_color=&#8221;yes&#8221; uncode_shortcode_id=&#8221;184254&#8243; back_color_type=&#8221;uncode-solid&#8221; overlay_color_type=&#8221;uncode-palette&#8221; el_class=&#8221;demo-section&#8221; row_name=&#8221;Demo 3&#8243; back_color_solid=&#8221;#2e93f2&#8243;][vc_column column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; css_animation=&#8221;alpha-anim&#8221; animation_speed=&#8221;1000&#8243; animation_delay=&#8221;200&#8243; width=&#8221;1\/1&#8243; uncode_shortcode_id=&#8221;210887&#8243;][vc_row_inner row_inner_height_percent=&#8221;0&#8243; overlay_alpha=&#8221;50&#8243; gutter_size=&#8221;4&#8243; shift_y=&#8221;0&#8243; z_index=&#8221;0&#8243; uncode_shortcode_id=&#8221;199817&#8243; limit_content=&#8221;&#8221;][vc_column_inner column_width_percent=&#8221;100&#8243; position_vertical=&#8221;middle&#8221; gutter_size=&#8221;3&#8243; style=&#8221;dark&#8221; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;4\/12&#8243; uncode_shortcode_id=&#8221;210818&#8243;][vc_custom_heading text_size=&#8221;fontsize-160000&#8243; el_class=&#8221;demo-subtitle&#8221; uncode_shortcode_id=&#8221;170335&#8243;]Demo 3[\/vc_custom_heading][vc_custom_heading text_size=&#8221;h1&#8243; sub_lead=&#8221;yes&#8221; sub_reduced=&#8221;yes&#8221; el_class=&#8221;demo-heading&#8221; uncode_shortcode_id=&#8221;183582&#8243;]Portfolio Studio[\/vc_custom_heading][vc_column_text el_class=&#8221;demo-lead-text&#8221; uncode_shortcode_id=&#8221;557896&#8243;]A creative portfolio in which each work is enhanced by a specific color variation that makes the contrasts stand-out.[\/vc_column_text][vc_button size=&#8221;btn-link&#8221; custom_typo=&#8221;yes&#8221; font_family=&#8221;font-377884&#8243; font_weight=&#8221;700&#8243; scale_mobile=&#8221;no&#8221; el_class=&#8221;demo-button btn-lg additional&#8221; icon=&#8221;fa fa-chevron-right2&#8243; uncode_shortcode_id=&#8221;780440&#8243; link=&#8221;url:#|title:Portfolio%20Studio&#8221;]View Demo[\/vc_button][\/vc_column_inner][vc_column_inner column_width_percent=&#8221;100&#8243; gutter_size=&#8221;3&#8243; style=&#8221;light&#8221; back_image=&#8221;99797&#8243; overlay_alpha=&#8221;50&#8243; shift_x=&#8221;0&#8243; shift_y=&#8221;0&#8243; shift_y_down=&#8221;0&#8243; z_index=&#8221;0&#8243; medium_width=&#8221;0&#8243; mobile_width=&#8221;0&#8243; width=&#8221;8\/12&#8243; uncode_shortcode_id=&#8221;143946&#8243; back_size=&#8221;100%&#8221; el_class=&#8221;image-card image-card-triple&#8221;][vc_single_image media=&#8221;2440&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-secondary&#8221; uncode_shortcode_id=&#8221;779212&#8243;][vc_single_image media=&#8221;11317&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-first&#8221; uncode_shortcode_id=&#8221;337094&#8243;][vc_single_image media=&#8221;100675&#8243; media_width_percent=&#8221;100&#8243; media_ratio=&#8221;three-two&#8221; alignment=&#8221;right&#8221; shadow=&#8221;yes&#8221; shadow_weight=&#8221;std&#8221; el_class=&#8221;demo-image demo-image-group-first&#8221; uncode_shortcode_id=&#8221;191398&#8243;][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>With the Color Changer, it\u2019s possible to smoothly fade your sections\u2019 background color and Skins while scrolling the page and creating a brand-new dynamic experience.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":125,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-89361","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/pages\/89361","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=89361"}],"version-history":[{"count":0,"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/pages\/89361\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=\/wp\/v2\/pages\/125"}],"wp:attachment":[{"href":"https:\/\/uncode.archiformazione.it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=89361"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}