Przejdź do głównej treści
LibraTool logoLibraTool

Generator palet kolorów za darmo

Generuj komplementarne, analogiczne, triadyczne i monochromatyczne palety kolorów z dowolnego koloru bazowego. Kopiuj kody hex jednym kliknięciem.

Działa offline po wczytaniu

Wpisz kod hex, nazwę koloru, np. teal lub tomato, albo rgb(20, 184, 166) / hsl(174, 80%, 40%), a następnie naciśnij Enter.

Paleta marki · 7 kolory
Format kopiowania
Eksport:
Bazowy
Na białym 2,5Niezaliczony
Na czarnym 8,4AAA
Akcent
Na białym 2,9Niezaliczony
Na czarnym 7,2AAA
Jasny odcień
Na białym 1,1Niezaliczony
Na czarnym 19,4AAA
Ciemny odcień
Na białym 9,0AAA
Na czarnym 2,3Niezaliczony
Neutralny jasny
Na białym 1,1Niezaliczony
Na czarnym 19,3AAA
Neutralny średni
Na białym 4,1AA duży tekst
Na czarnym 5,1AA
Neutralny ciemny
Na białym 16,1AAA
Na czarnym 1,3Niezaliczony

Sprawdzenie tekstu i tła

Przykład dużego nagłówka
Przykład tekstu podstawowego dla tej pary
8,44:1Zwykły tekst AAADuży tekst AAA
Wypróbuj

Chcesz kolory ze zdjęcia? Użyj narzędzia do wyodrębniania kolorów z obrazu

Typowe zastosowania

  • Wygeneruj palety kolorów do projektowania stron internetowychUtwórz harmonijne schematy kolorów dla witryn internetowych, aplikacji internetowych i komponentów interfejsu użytkownika.
  • Utwórz palety kolorów markiOpracuj kompletny system koloru marki na podstawie jednego koloru marki — pierwotny, wtórny, akcent i neutralne.
  • Wygeneruj palety kolorów do sztuki i ilustracjiUtwórz harmonijne kombinacje kolorów do sztuki cyfrowej, ilustracji i projektów kreatywnych.
  • Wygeneruj style kolorów dla FigmaUtwórz palety kolorów do użycia jako style koloru Figma i fundamenty tokenów projektowych.
  • Utwórz palety kolorów w trybie ciemnymWygeneruj warianty jasne i ciemne palety kolorów w celu budowania obsługi trybu ciemnego.

Jak to działa

Narzędzie powstało bez żadnych zewnętrznych bibliotek — cała matematyka kolorów działa w ręcznie napisanym JavaScript bezpośrednio w przeglądarce. Przelicza wybrany kolor między hex a HSL, a następnie stosuje klasyczne reguły harmonii kolorów (komplementarne, triada, analogiczne itd.) przez arytmetykę na kole barw, aby utworzyć każdą paletę.

  1. 1
    Konwersja hex na HSL
    Po wybraniu koloru narzędzie parsuje ciąg hex na składowe RGB i przelicza je na HSL (odcień, nasycenie, jasność). Odcień to pozycja 0–360 stopni na kole barw; cała matematyka palet odbywa się w tej przestrzeni.
  2. 2
    Arytmetyka odcienia dla harmonii
    Każdy typ palety to stały wzór obrotu stosowany do odcienia bazowego. Komplementarne dodaje 180°, triada dodaje 120° i 240°, tetrada przesuwa się co 90°, rozdzielone komplementarne używa 150° i 210°. Monochromatyczne i odcienie utrzymują stały odcień i nasycenie, zmieniając jasność w górę i w dół.
  3. 3
    Wynik HSL na hex
    Każda obliczona trójka HSL jest przeliczana z powrotem na kolor hex standardowym wzorem chroma. Wyniki wyświetlają się jako pasek kolorów z etykietami o automatycznie dobranym kontraście (ciemny tekst na jasnych próbkach, jasny na ciemnych), wyznaczonym prostym progiem luminancji.
  4. 4
    Eksport w preferowanym formacie
    Paletę można skopiować jako ciągi hex lub wyeksportować jako plik zmiennych CSS (:root { --color-1: … }), zmienne SCSS, fragment konfiguracji Tailwind, obiekt JSON lub pasek kolorów PNG. Eksport PNG używa Canvas API przeglądarki (toDataURL) do narysowania każdej próbki z etykietą hex — wszystko jest generowane lokalnie po kliknięciu.

Powiązane narzędzia

🎨

Generator losowych kolorów

Generuj losowe kolory pojedynczo lub jako paletę pięciu, zablokuj te, które Ci się podobają, kopiuj wartości HEX, RGB lub HSL i eksportuj paletę jako PNG lub CSS.

Wypróbuj
🎨

Ekstraktor palety kolorów z obrazu

Wyodrębnij dominujące kolory z dowolnego obrazu przy użyciu kwantyzacji kolorów k-means. Uzyskaj kody hex dla 2–16 najczęściej używanych kolorów na zdjęciu lub logo.

WypróbujPliki pozostają lokalnie
🎨

Selektor kolorów i generator palet

Wybieraj kolory, konwertuj HEX/RGB/HSL i generuj harmonijne palety.

Wypróbuj

Często zadawane pytania