{"id":6793,"date":"2021-06-29T10:46:10","date_gmt":"2021-06-29T08:46:10","guid":{"rendered":"https:\/\/lacolmenatecnologica.com\/colori-globali-font-globali-e-stili-del-tema-in-elementor\/"},"modified":"2026-09-02T22:45:15","modified_gmt":"2026-09-02T20:45:15","slug":"colori-globali-font-globali-e-stili-del-tema-in-elementor","status":"publish","type":"post","link":"https:\/\/lacolmenatecnologica.com\/it\/colori-globali-font-globali-e-stili-del-tema-in-elementor\/","title":{"rendered":"Colori globali, Font globali e Stili del tema in Elementor"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Video passo dopo passo<\/h2>\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Colores globales, Fuentes globales y Estilos del tema en Elementor\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/o4OerQrGXrM?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n<h2 class=\"wp-block-heading\">Introduzione<\/h2>\n\n<p class=\"wp-block-paragraph\">Crea il tuo sistema di design con colori globali e stili di testo che possono essere facilmente assegnati agli elementi del tuo sito.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"colores-globales-0cbb8ef2-9815-4ade-beef-aa482c39df37\">Colori globali<\/h2>\n\n<p class=\"wp-block-paragraph\">Imposta colori globali predefiniti (colori primari, secondari, del testo e di accento), colori personalizzati in linea o crea nuovi colori globali dalle <em>impostazioni<\/em> globali di Elementor<em>.<\/em><\/p>\n\n<h2 class=\"wp-block-heading\" id=\"global-57b5cb54-aeec-4736-b687-d4ef2bba467d\">Globale<\/h2>\n\n<p class=\"wp-block-paragraph\"><strong>Colori globali predefiniti<\/strong><\/p>\n\n<p class=\"wp-block-paragraph\">Per impostazione predefinita, i colori predefiniti (<em>primario<\/em>, <em>secondario<\/em>, <em>testo<\/em> e <em>accento<\/em>) vengono precompilati dal CSS del tuo tema. Modificali qui per sovrascrivere le impostazioni del tuo tema. Quali elementi sono influenzati dalla palette di colori predefinita:  <\/p>\n\n<ul class=\"wp-block-list\">\n<li><strong>I colori primari<\/strong> sono usati per <em>titoli<\/em> e <em>icone<\/em>.<\/li>\n\n\n\n<li><strong>I colori secondari<\/strong> sono usati per <em>sfondi di elementi di lista<\/em>, <em>sottotitoli<\/em>, <em>intestazioni animate<\/em> e <em>tabelle prezzi<\/em>.<\/li>\n\n\n\n<li><strong>I colori del testo<\/strong> sono usati per <em>paragrafi<\/em> e <em>elementi di menu<\/em>.<\/li>\n\n\n\n<li><strong>I colori di accento<\/strong> sono usati per <em>link<\/em>, <em>sfondi di pulsanti<\/em>, <em>intestazioni di tab e fisarmonica<\/em> e <em>badge<\/em>.<\/li>\n<\/ul>\n\n<p class=\"wp-block-paragraph\">Ciascuno dei colori verr\u00e0 utilizzato in vari widget in modo simile agli esempi precedenti. Di seguito sono riportati alcuni esempi di colori per aiutare a visualizzare le aree in cui viene utilizzato ogni colore. <\/p>\n\n<h3 class=\"wp-block-heading\" id=\"nuevos-colores-globales-1b835ea9-00bf-42f4-abdf-bbd9f01dcd0b\">Nuovi colori globali<\/h3>\n\n<p class=\"wp-block-paragraph\">Oltre ai 4 colori globali predefiniti (primario, secondario, testo e accento), puoi aggiungere qualsiasi colore tu scelga alla palette globale, da usare in qualsiasi opzione di colore di Elementor.<\/p>\n\n<h3 class=\"wp-block-heading\" id=\"colores-personalizados-en-linea-a5b54e4d-9204-4ba2-a965-47932c988a2f\">Colori personalizzati in linea<\/h3>\n\n<p class=\"wp-block-paragraph\">Puoi anche selezionare qualsiasi colore personalizzato da usare in linea senza aggiungerlo alla palette di colori globali.<\/p>\n\n<p class=\"wp-block-paragraph\">Da qualsiasi pagina o post di Elementor, fai clic sul <strong>menu hamburger<\/strong> nell&#8217;angolo in alto a sinistra del Pannello widget, quindi fai clic su <em>Impostazioni del sito &gt; <\/em>nella sezione <em>DESIGN DEL SISTEMA &gt; <\/em>fai clic su <em>Colori Globali<\/em>.<\/p>\n\n<ol class=\"wp-block-list\">\n<li><strong>Modifica colore<\/strong>: fai clic sul <strong>campione di colore<\/strong> per selezionare un nuovo colore per qualsiasi colore esistente. I nomi possono anche essere modificati. Fai clic sul <strong>nome del colore<\/strong> per cambiarlo. Ad esempio, puoi cambiare Principale in Titoli, Accento in Evidenziato, ecc.   <\/li>\n\n\n\n<li><strong>Aggiungi colore<\/strong>: fai clic sul <strong>pulsante Aggiungi colore<\/strong> per aggiungere un nuovo colore personalizzato globale o in linea.<\/li>\n\n\n\n<li><strong>Elimina colore<\/strong>: posiziona il cursore sul campione di colore e fai clic sull&#8217;<strong>icona del<\/strong> <strong>cestino<\/strong> che appare.<\/li>\n<\/ol>\n\n<h2 class=\"wp-block-heading\" id=\"sistema-de-colores-hexadecimal-3d86b3de-d2b5-4a1a-b88f-c603c7157447\">Sistema di colori Esadecimale<\/h2>\n\n<p class=\"wp-block-paragraph\">In HTML si usa il codice Hex o esadecimale per definire i colori. Per capire un po&#8217; meglio come si trascrive questo codice, vediamo questo grafico: <\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/Colores-Hex.png\"><img loading=\"lazy\" decoding=\"async\" width=\"350\" height=\"105\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/Colores-Hex.png\" alt=\"Sistema di colori Esadecimale\" class=\"wp-image-5050\"\/><\/a><\/figure>\n<\/div>\n<p class=\"wp-block-paragraph\">Come possiamo vedere nell&#8217;immagine, seguito dal simbolo cancelletto o hashtag <strong>#<\/strong> i codici Hex per definire un colore hanno altri 6 cifre, che definiscono un colore <strong>RGB<\/strong> (Red Green Blue o Rosso Verde Blu) tutti i colori dello spettro sono composti dalla miscela di questi tre colori base. Nel codice Hex le prime due cifre corrispondono al colore <strong>Rosso<\/strong>, le due centrali al <strong>Verde<\/strong> e le ultime due al <strong>Blu.<\/strong>  <\/p>\n\n<p class=\"wp-block-paragraph\">Immagina di avere tre barattoli di vernice, uno di colore rosso, un altro di colore verde e un altro di colore blu, e di mescolare questi colori in un recipiente aggiungendo una certa quantit\u00e0 di ciascuno, il risultato sar\u00e0 un colore determinato. In questo caso \u00e8 esattamente lo stesso, a seconda della quantit\u00e0 di ogni colore che aggiungiamo otterremo un colore specifico. <\/p>\n\n<p class=\"wp-block-paragraph\">Fin qui tutto bene, ma&#8230; nei codici Hex non ci sono solo numeri, ma anche lettere, vediamo perch\u00e9. Noi siamo abituati a lavorare con il sistema decimale, cio\u00e8 con una base di 10 cifre (0, 1, 2, 3, 4, 5, 6, 7, 8 e 9) usando queste cifre componiamo qualsiasi quantit\u00e0 numerica. Nel caso dei codici per colori Hex lavoriamo con base esadecimale, cio\u00e8, invece di 10, usiamo 16 cifre (0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E e F).  <\/p>\n<div class=\"wp-block-image is-resized\">\n<figure class=\"alignright size-full\"><a href=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/paleta-de-colores.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"674\" height=\"484\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/paleta-de-colores.jpg\" alt=\"Palette di colori di Photoshop\" class=\"wp-image-5049\" srcset=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/paleta-de-colores.jpg 674w, https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/paleta-de-colores-500x359.jpg 500w, https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/paleta-de-colores-600x431.jpg 600w\" sizes=\"auto, (max-width: 674px) 100vw, 674px\" \/><\/a><figcaption class=\"wp-element-caption\">Palette di colori di Photoshop<\/figcaption><\/figure>\n<\/div>\n<p class=\"wp-block-paragraph\">Usando solo due cifre il valore esadecimale minore \u00e8 <strong>00<\/strong> (equivale in decimale a 0) e il maggiore <strong>FF<\/strong> (equivale in decimale a 255), cio\u00e8 possiamo aggiungere alla miscela di ogni colore tra 0 e 255. Vediamo alcuni esempi rappresentati in forma esadecimale: <\/p>\n\n<ul class=\"wp-block-list\">\n<li><span class=\"has-inline-color has-black-color\"><strong>#000000<\/strong><\/span> (Nero: in decimale 0 unit\u00e0 di rosso, 0 di verde e 0 di blu)<\/li>\n\n\n\n<li><strong><span class=\"has-inline-color has-white-color\">#FFFFFF<\/span><\/strong> (Bianco: in decimale 255 unit\u00e0 di rosso, 255 di verde e 255 di blu)<\/li>\n\n\n\n<li><span style=\"color:#ff0000\" class=\"has-inline-color\"><strong>#FF0000<\/strong><\/span> (Rosso: in decimale 255 unit\u00e0 di rosso, 0 di verde e 0 di blu)<\/li>\n\n\n\n<li><strong><span style=\"color:#00fa1f\" class=\"has-inline-color\">#00FF00<\/span><\/strong> (Verde: in decimale 0 unit\u00e0 di rosso, 255 di verde e 0 di blu)<\/li>\n\n\n\n<li><strong><span style=\"color:#0000ff\" class=\"has-inline-color\">#0000FF<\/span><\/strong> (Blu: in decimale 0 unit\u00e0 di rosso, 0 di verde e 255 di blu)<\/li>\n\n\n\n<li><strong><span style=\"color:#999999\" class=\"has-inline-color\">#999999<\/span><\/strong> (Grigio: in decimale 153 unit\u00e0 di rosso, 153 di verde e 153 di blu)<\/li>\n<\/ul>\n\n<p class=\"wp-block-paragraph\">Con questo sistema un computer a 24 bit pu\u00f2 riprodurre fino a 16.777.216 colori diversi, una quantit\u00e0 pi\u00f9 che sufficiente, considerando che l&#8217;occhio umano pu\u00f2 distinguere solo 10 milioni di colori.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"enlaces-de-interes-3e2d43e7-82ee-47a4-ade0-f9d954b1753a\">Link utili<\/h2>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/unayta.es\/teoria-del-color\/\" target=\"_blank\" rel=\"noreferrer noopener\">Teoria del colore: Guida base al colore<\/a><\/li>\n\n\n\n<li>Estensione per browser con cui potrai catturare il colore Hex di qualsiasi parte di una pagina web:\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/addons.mozilla.org\/es\/firefox\/addon\/colorzilla\/\" target=\"_blank\" rel=\"noreferrer noopener\">Colorzilla: Ottieni l&#8217;estensione per Firefox<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/chrome.google.com\/webstore\/detail\/colorzilla\/bhlhnicpbhignbdhedgjhgdocnmhomnp\" target=\"_blank\" rel=\"noreferrer noopener\">Colorzilla: Ottieni l&#8217;estensione per Google Chrome<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/apps.apple.com\/co\/app\/colorzilla-a-color-picker\/id1201207838\" target=\"_blank\" rel=\"noreferrer noopener\">Colorzilla: Ottieni l&#8217;estensione per Mac<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Video passo dopo passo Introduzione Crea il tuo sistema di design con colori globali e stili di testo che possono essere facilmente assegnati agli elementi del tuo sito. Colori globali Imposta colori globali predefiniti (colori primari, secondari, del testo e di accento), colori personalizzati in linea o crea nuovi colori globali dalle impostazioni globali di [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":6794,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_titles_title":"Colori e font globali in Elementor: guida pratica","_seopress_titles_desc":"Crea il tuo sistema di design con colori globali e stili di testo che possono essere facilmente assegnati agli elementi del tuo sito. Colori globali Imposta\u2026","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"none","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"entrambi","_seopress_redirections_param":"","_seopress_redirections_type":301,"_seopress_analysis_target_kw":"","_seopress_news_disabled":"","_seopress_video_disabled":"","_seopress_video":[],"_seopress_pro_schemas_manual":[],"_seopress_pro_rich_snippets_disable_all":"","_seopress_pro_rich_snippets_disable":[],"_seopress_pro_schemas":[],"footnotes":"","_bricks_page_content_2":[],"_bricks_page_header_2":[],"_bricks_page_footer_2":[]},"categories":[401],"tags":[430,407],"class_list":["post-6793","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-elementor","tag-personalizzazione-di-wordpress","tag-web-design"],"_links":{"self":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6793","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/comments?post=6793"}],"version-history":[{"count":1,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6793\/revisions"}],"predecessor-version":[{"id":6795,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6793\/revisions\/6795"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/media\/6794"}],"wp:attachment":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/media?parent=6793"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/categories?post=6793"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/tags?post=6793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}