Softonic

Generator kolorów analogicznych

Krok 1 z 3
Dalej

Wybierz kolor bazowy i kąt rozstawu. Narzędzie pokaże kolor bazowy oraz po jednym sąsiednim odcieniu z każdej strony w wybranej odległości kątowej, klasyczną analogiczną trójkę, a także dwie zewnętrzne barwy w odległości dwukrotnie większej, tworząc szerszą paletę pięciu kolorów. Palety analogiczne należą do najbardziej harmonijnych klasycznych schematów, ponieważ bliskie sobie odcienie mają wspólną dominantę. Dlatego często występują w naturze (zachody słońca, lasy) i projektowaniu wydawniczym.

Jak zbudować paletę analogiczną

  1. 1

    Wybierz kolor bazowy

    Wklej kod hex, trójkę RGB albo wartość HSL. Nasycone kolory o średniej jasności dają najbogatsze zestawy analogiczne.

  2. 2

    Wybierz kąt przesunięcia

    30° to klasyczny odstęp analogiczny. 15° daje ciaśniejszy, prawie monochromatyczny zestaw; 45° zaczyna zbliżać się do schematu dopełniającego rozdzielonego.

  3. 3

    Dostosuj różnicę jasności

    Opcjonalnie zmień jasność między trzema odcieniami, żeby paleta nie była płaska. Rozjaśnienie dwóch skrzydeł daje łagodniejszy, editorialowy efekt.

  4. 4

    Eksportuj kolory

    Skopiuj hex, RGB albo HSL. Przydatne do zmiennych CSS, stylów w Figma albo specyfikacji do druku.

Klasyczne schematy kolorów a paleta analogiczna

Schemat Relacja kątowa Charakter
Monochromatyczny 0° (ten sam odcień, różna jasność/nasycenie) Spokojny, spójny
Analogiczny 30° po obu stronach Harmonijny, naturalny
Komplementarny 180° różnicy Wysoki kontrast, napięcie
Dopełniająca rozdzielona Baza + 2 odcienie po bokach dopełnienia Kontrast z niuansem
Triadyczny 120° różnicy Zbalansowany, żywy
Tetradyczny Dwie pary komplementarne Bogaty, złożony

Przykłady palet analogicznych z natury

  • Zachód słońca: żółty → pomarańczowy → czerwono-pomarańczowy (skoki 30° po ciepłej stronie).
  • Las: żółto-zielony → zielony → niebiesko-zielony.
  • Ocean: niebiesko-zielony → niebieski → niebiesko-fioletowy.
  • Jesień: czerwono-pomarańczowy → pomarańczowy → żółto-pomarańczowy.

Projektowanie z zestawem analogicznym

  • Wybierz jeden kolor jako dominujący (60% powierzchni), drugiego użyj jako akcentu (30%), a trzeciego jako podkreślenia (10%), zasada “60-30-10”.
  • Łącz kolory analogiczne z neutralnym tłem (biel, czerń, ciepła szarość) dla tekstu i elementów UI.
  • Unikaj trzech kolorów analogicznych o takim samym nasyceniu na dużych blokach, wyglądają mętnie. Zmieniaj jasność lub nasycenie między skrzydłami a bazą.

Przestrzenie barw i matematyka kątów

Przesunięcie 30° jest liczone w przestrzeni odcienia HSL albo HSV, gdzie odcień traktuje się jako kąt (0-360°). Operacje na kole w RGB nie działają, trzeba przekonwertować do HSL, obrócić odcień i wrócić z powrotem. Właśnie to narzędzie robi pod spodem. Wynik we wszystkich trzech notacjach jest dostępny, bo CSS, narzędzia projektowe i procesy drukarskie preferują różne formaty.

Najczęściej zadawane pytania

Monochromatyczna używa jednego odcienia z różną jasnością i nasyceniem (granat, niebieski, błękit). Analogiczna używa trzech różnych odcieni sąsiadujących na kole (niebiesko-zielony, niebieski, niebiesko-fioletowy). Paleta analogiczna daje większą różnorodność wizualną.

Kolory analogiczne mogą mieć nakładające się mieszanki farb CMYK, co zmniejsza kontrast w druku. Sprawdź wersje w proofie ekranowym (soft-proof) i rozważ zwiększenie odstępu z 30° do 40° przy projektach drukowanych.

Tak, ale niech jeden z trzech kolorów będzie dominującym kolorem marki, a pozostałe dwa pełnią role wspierające (etykiety, akcenty). Używanie wszystkich trzech do głównych akcji w interfejsie wprowadza zamieszanie: użytkownicy uczą się kojarzyć jeden kolor z głównym wezwaniem do działania.

Trzy środkowe kolory tworzą klasyczny schemat analogiczny: odcień bazowy i dwóch sąsiadów oddalonych o wybrany kąt. Dwa zewnętrzne kolory leżą w odległości dwukrotnie większej i są dodatkowymi propozycjami rozszerzającymi paletę. Przy domyślnym rozstawie 30° trójka znajduje się na ±30°, a zewnętrzna para na ±60°.

Powiązane narzędzia

Konwerter Base64 na Hex

Konwertuj ciąg Base64 na jego bazowe bajty zapisane szesnastkowo. Przydatne do inspekcji tokenów, kluczy, certyfikatów i JWT.

Konwerter ASCII na binarny

Konwertuj dowolny ciąg ASCII na reprezentację binarną. Każdy znak staje się ośmioma bitami, rozdzielonymi spacjami, gotowymi do wklejenia w ślad protokołu albo zadanie domowe.

Konwerter ASCII na hex

Konwertuj tekst ASCII na szesnastkowe wartości bajtów. Wynik używa dwóch cyfr hex na znak, gotowych do dumpów pamięci, śladów pakietów albo tabel firmware.

Generator losowych kolorów

Wygeneruj od 1 do 50 losowych kolorów HEX z próbkami do podglądu, kopiowania i użycia w CSS, testach lub tworzeniu palet.

Generator losowych palet kolorów

Twórz losowe palety od 2 do 15 próbek, wybierz styl żywy, pastelowy, stonowany lub ciemny, a następnie skopiuj kody HEX albo zmienne CSS.

Konwerter binarny na hex

Konwertuj wejście binarne na zwykłą wartość szesnastkową wielkimi literami. Znaki inne niż 0 i 1 są ignorowane, a zera wiodące nie są zachowywane.