Jak změnit doplňkovou barvu za vlastní

19.09.2024

Ve Webnode je možné vybrat jednu ze systémových výchozích barev, která se bude zobrazovat například v nabídkách, seznamech, nadpisech a dalších grafických prvcích. Tento výběr je však velmi omezený a je velmi nepravděpodobné, že v příručce značky najdete přesně ten odstín, který doporučil grafik. Díky kódům jej však můžete poměrně snadno upravit.

Jaká jsou omezení nastavení vlastní barvy?

Webnode neumí správně vypočítat "chytré barvy" pro části pozadí. V takovém případě bude zapotřebí další kód nebo se pozadí nahrají jako obrázky.


Na co si dát pozor při výběru barvy

Určitě na kontrast barev. Písmo musí být čitelné s ohledem na pozadí. 

Kontrast lze vypočítat pomocí prohlížeče nebo můžete použít tyto nástroje:

Jak nastavit barvu značky ve Webnode

1. Budeme potřebovat nejen kód HEX, ale také kód RGB barvy značky.

👉 Pokud máte více barev, pošlete mi zprávu a já připravím komplexnější kód.

Kódy barev získáte od grafika v manuálu značky. Pokud si barvu vybíráte sami, doporučuji službu coolors, kde si můžete vygenerovat celou tapetu včetně odstínů.

 Dalším dobrým zdrojem je knihovna Figma, Adobe Colors a mnoho dalších.

2. Do hlavičky HTML v nastavení celého webu vložte následující kód:

<style>
:root {
--ac-color: #XXXXXX!important;
--ac-color-rgb: YY, YY, YY!important;
}
</style>

3. Nahraďte:

  • XXXXXX kódem HEX vybrané barvy,
  • YY, YY, YY kódem RGB vybrané barvy.

4. Uložte a zveřejněte své změny.

Hotovo 💅