Generator palety kolorów
Generator palet kolorów tworzy 5-kolorową paletę z dowolnego koloru bazowego, korzystając z harmonii teorii koloru — dopełniającej, triadycznej, analogicznej, rozdzielonej dopełniającej, tetradycznej lub monochromatycznej — i eksportuje ją jako właściwości niestandardowe CSS.
O tym narzędziu
Generator palet kolorów tworzy 5-kolorową paletę z dowolnego koloru bazowego, korzystając z harmonii teorii koloru — dopełniającej, triadycznej, analogicznej, rozdzielonej dopełniającej, tetradycznej lub monochromatycznej — i eksportuje ją jako właściwości niestandardowe CSS.
Jak używać
- Wybierz kolor bazowy próbnikiem.
- Wybierz rodzaj harmonii, np. dopełniającą lub triadyczną.
- Przejrzyj pięć wygenerowanych próbek.
- Kliknij Copy as CSS Variables, aby wkleić paletę do arkusza stylów.
Warto wiedzieć
- Kolory dopełniające leżą na kole barw 180° od siebie; kolory triadyczne są oddalone o 120°.
- Palety analogiczne korzystają z sąsiednich odcieni (około 30° od siebie) i zwykle sprawiają spokojne, spójne wrażenie.
- Harmonia rozdzielona dopełniająca łączy odcień bazowy z dwoma odcieniami po obu stronach jego dopełnienia (±30°), dając kontrast przy mniejszym napięciu.
- Palety monochromatyczne zachowują jeden odcień i zmieniają tylko nasycenie oraz jasność.
- Generator działa w HSL, który obraca odcień bez zmiany jasności koloru.
Działa w całości w przeglądarce — nic, co wpiszesz, nie jest wysyłane ani zapisywane.
Najczęściej zadawane pytania
Czym jest paleta kolorów dopełniających?
Paleta dopełniająca łączy odcień z tym, który leży dokładnie naprzeciwko na kole barw (180° dalej), np. niebieski i pomarańczowy. Daje najsilniejszy kontrast ze wszystkich harmonii.
Ile kolorów powinna mieć paleta strony internetowej?
Większość interfejsów używa jednego koloru głównego, jednego lub dwóch akcentów i zestawu neutralnych barw. Pięciokolorowa harmonia to dobry punkt wyjścia, który możesz okroić lub rozbudować o jaśniejsze i ciemniejsze odcienie.
Czym różni się harmonia triadyczna od tetradycznej?
Triadyczna używa trzech odcieni rozmieszczonych równo co 120°. Tetradyczna używa czterech odcieni co 90°, tworząc kwadrat na kole — jest bogatsza, ale trudniej ją zrównoważyć.
Czy mogę użyć palety w CSS lub Tailwind?
Tak. Skopiuj paletę jako właściwości niestandardowe CSS i odwołuj się do nich przez var() albo wklej wartości hex do kolorów motywu Tailwind.