Generátor barevných palet

O barevných paletách

Barevná paleta je sada barev vybraných tak, aby spolu ladily v designu. Dobré palety vytvářejí vizuální harmonii, vedou pohled diváka a komunikují náladu a identitu značky.

Schéma barevné harmonie

• Komplementární: Dvě barvy přímo naproti na barevném kole. Vytváří maximální kontrast a živost.
• Analogické: Tři až pět barev sousedících na kole. Produkuje klidné, harmonické designy.
• Triadické: Tři barvy rovnoměrně rozmístěné (120° od sebe). Živé, ale vyvážené.
• Tetrádické (Obdélník): Čtyři barvy tvořící obdélník. Bohaté a univerzální, ale vyžaduje pečlivé vyvážení.
• Monochromatické: Varianty jednoho odstínu v různých úrovních světlosti. Čisté a jednotné.

Použití CSS proměnných

Exportujte paletu jako CSS vlastnosti pro snadné tematické nastavení. Definujte je v :root a odkazujte na ně pomocí var(--color-1) napříč vašimi styly. Usnadňuje to výměnu témat nebo úpravu barev globálně.

Jak používat generátor barevných palet

1. Vyberte základní barvu pomocí výběru barvy nebo zadejte hodnotu HEX přímo. Tato základní barva slouží jako kotva pro všechny generované barevné vztahy.
2. Zvolte schéma harmonie: komplementární (opačná barva na kole), analogické (sousední barvy), triadické (tři rovnoměrně rozmístěné barvy), tetrádické (čtyři barvy tvořící obdélník) nebo monochromatické (varianty stejného odstínu s různou světlostí).
3. Prohlédněte si vygenerovanou paletu zobrazující všechny barvy s jejich hodnotami HEX, RGB a HSL. Upravte základní barvu nebo vyzkoušejte různá schémata, dokud nenajdete kombinaci, která funguje pro váš projekt.
4. Exportujte paletu jako CSS vlastní vlastnosti (proměnné) pro přímou integraci do vašeho stylesheetu nebo kopírujte jednotlivé barevné hodnoty podle potřeby.

Principy barevné teorie a harmonie

Barevná harmonie se týká vizuálně příjemného uspořádání barev založeného na jejich vztazích na barevném kole. Barevné kolo, poprvé navržené Isaacem Newtonem v roce 1666, uspořádává odstíny do kruhu, kde jsou primární barvy (červená, žlutá, modrá) rovnoměrně rozmístěny a sekundární barvy (oranžová, zelená, fialová) sedí mezi nimi. Harmonická barevná schémata využívají geometické vztahy na tomto kole: komplementární barvy jsou 180° od sebe, analogické barvy jsou do 30-60° od sebe a triadické barvy jsou rozmístěny 120° od sebe. Tyto matematické vztahy produkují kombinace, které lidské oko vnímá jako přirozeně vyvážené a esteticky příjemné.

Každé schéma harmonie vytváří jinou náladu a slouží různým designovým účelům. Komplementární schémata (např. modrá a oranžová) vytvářejí vysoký kontrast a energii, což je činí ideálními pro výzvy k akci a sportovní branding. Analogická schémata (např. modrá, tyrkysová a zelená) produkují klidné, sourodé designy vhodné pro přírodu, zdraví a wellness značky. Triadická schémata (např. červená, žlutá, modrá) nabízejí živou rovnováhu a jsou běžná v dětských produktech a hravém brandingu. Tetrádická (dvojitě komplementární) schémata poskytují bohatou rozmanitost, ale vyžadují pečlivou správu dominance. Monochromatická schémata používají jeden odstín s různou světlostí a sytostí, což vytváří elegantní, sofistikované designy, které se snadno provádějí dobře.

Při budování palety pro web design je běžným rámcem pravidlo 60-30-10: jedna dominantní barva pokrývá 60% designu (obvykle neutrální nebo značková barva), sekundární barva pokrývá 30% a akcentní barva pokrývá 10% pro zvýraznění a výzvy k akci. Tento generátor exportuje palety jako CSS vlastní vlastnosti (--color-primary: #3b82f6;), což je činí triviálně snadnými pro tematické změny a výměny. Přístupnost je dalším kritickým aspektem — vždy kontrolujte kontrastní poměry WCAG (minimálně 4,5:1 pro běžný text a 3:1 pro velký text), abyste zajistili, že vaše paleta je použitelná pro lidi se zrakovým postižením.