Darmowe narzędzie

Generator palety kolorów

Wrzuć zdjęcie. Dostaniesz jego główne kolory z kodami HEX i RGB, kontrolę kontrastu z białym i czarnym tekstem oraz podgląd strony link w bio w tych kolorach.

Twoje zdjęcie

Liczba kolorów
Kolejność

Twoja paleta

    Podgląd na stronie link w bio

    Ana Ruiz

    Zajęcia z ceramiki i garncarstwa

    Kup nowe kubkiZarezerwuj zajęciaNajnowszy film

      Co robi generator palety kolorów

      Generator palety kolorów znajduje główne kolory na obrazie i podaje ich kody. Ten czyta Twoje zdjęcie w przeglądarce, grupuje podobne piksele i zwraca 5, 6 lub 8 kolorów, które pokrywają największą część obrazu. Każdy kolor ma kod HEX i RGB oraz kontrolę kontrastu dla tekstu.

      Twórcy używają palety ze swoich zdjęć, żeby profil, posty i strona link w bio wyglądały jak jeden zestaw. Kontrola kontrastu mówi, które kolory mogą nieść tekst, a które lepiej sprawdzą się jako tło lub akcent.

      Twoje zdjęcie nigdy nie opuszcza Twojego urządzenia. Narzędzie rysuje je na canvasie w przeglądarce, więc nie ma przesyłania, konta ani limitu.

      Jak zrobić paletę ze zdjęcia

      1. Wrzuć zdjęcie

        Użyj zdjęcia, które często publikujesz, na przykład zdjęcia profilowego lub zdjęcia produktu. Działają pliki JPG, PNG i WebP.

      2. Wybierz liczbę kolorów

        Wybierz 5, 6 lub 8 kolorów. Posortuj je według tego, jak dużą część zdjęcia pokrywają, lub od jasnych do ciemnych.

      3. Sprawdź kontrast

        Każdy kolor pokazuje swój kontrast z białym i czarnym tekstem. Do przycisków z tekstem używaj kolorów, które przechodzą test.

      4. Skopiuj kody

        Skopiuj jeden kod HEX, całą listę lub paletę jako zmienne CSS do swojej strony.

      Zasady kontrastu tekstu na Twoich kolorach

      Wytyczne WCAG 2.2 (Web Content Accessibility Guidelines) ustalają minimalny kontrast między tekstem a tłem. Plakietki w narzędziu używają tych liczb.

      Co sprawdzaszMinimalny stosunekZasada WCAG
      Zwykły tekst na kolorze4.5:11.4.3 Contrast (Minimum), poziom AA
      Duży tekst: 24 px lub 18,5 px pogrubiony3:11.4.3 Contrast (Minimum), poziom AA
      Zwykły tekst, bardziej rygorystyczny poziom7:11.4.6 Contrast (Enhanced), poziom AAA
      Duży tekst, bardziej rygorystyczny poziom4.5:11.4.6 Contrast (Enhanced), poziom AAA
      Przycisk lub ikona na tle strony3:11.4.11 Non-text Contrast, poziom AA

      Źródła: W3C, Understanding 1.4.3 Contrast (Minimum), W3C, Understanding 1.4.6 Contrast (Enhanced), W3C, Understanding 1.4.11 Non-text Contrast. Sprawdzono 11 listopada 2026.

      Na Twojej stronie More.You

      Twoje kolory na stronie link w bio

      Na stronie More.You sam ustawiasz tło, przyciski, czcionki i kolory. Każda zmiana trafia do szkicu z możliwością cofnięcia, więc Twoja działająca strona nigdy nie pokazuje niedokończonego projektu.

      more.you/

      • Motywy i kolory w planie Free

        Wybierz motyw, a potem zmień tapetę, styl przycisków, czcionki i kolory. Przetasuj galerię motywów, gdy szukasz pomysłów.

        Motywy i projekt

      • Zacznij od szablonu

        Szablony według zawodu dają gotową pierwszą stronę. Zastosuj jeden, a potem podmień kolory na te ze swojego zdjęcia.

        Szablony link w bio

      • Pięć układów nagłówka

        Nagłówki klasyczny, hero, baner, wycinek i kształt umieszczają Twoje zdjęcie tam, gdzie najlepiej pasuje do Twojej palety.

      Pytania o paletę kolorów

      Jak generator palety kolorów wybiera kolory?

      Zmniejsza Twoje zdjęcie do małej kopii, czyta każdy piksel i sortuje piksele w grupy podobnych kolorów metodą zwaną median cut. Uśrednia każdą grupę, odrzuca kolory, które wyglądają prawie tak samo, i zachowuje te, które pokrywają największą część zdjęcia.

      Czy moje zdjęcie jest dokądś przesyłane?

      Nie. Narzędzie otwiera Twoje zdjęcie w przeglądarce i czyta je w elemencie canvas na Twoim urządzeniu. Nic nie jest wysyłane do More.You ani na żaden inny serwer i nic nie jest zapisywane. Zamknij kartę, a zdjęcie i paleta znikną.

      Co oznaczają kody HEX i RGB?

      Oba opisują ten sam kolor. RGB podaje ilość czerwieni, zieleni i niebieskiego od 0 do 255, na przykład rgb(178, 246, 227). HEX zapisuje te same trzy liczby w systemie szesnastkowym po znaku kratki, na przykład #B2F6E3. Większość aplikacji do projektowania i kreatorów stron przyjmuje oba.

      Jaki kontrast potrzebuje tekst, by był czytelny?

      WCAG 2.2, standard dostępności stron internetowych, wymaga współczynnika kontrastu co najmniej 4,5:1 dla zwykłego tekstu i 3:1 dla dużego tekstu na poziomie AA. Duży tekst to 24 px lub 18,5 px pogrubiony. Plakietki obok każdego koloru pokazują jego współczynnik z białym i czarnym tekstem.

      Jak użyć palety na mojej stronie link w bio?

      Użyj najjaśniejszego koloru jako tła strony, a mocniejszego na przyciski. Potem sprawdź, czy tekst przycisku osiąga 4,5:1 na kolorze przycisku. Podgląd w narzędziu pokazuje ten układ i mówi, które pary przechodzą.

      Jakich typów plików mogę użyć?

      Dowolnego obrazu, który otworzy Twoja przeglądarka, takiego jak JPG, PNG, WebP i GIF. W przypadku GIF narzędzie czyta pierwszą klatkę. Jeśli plik się nie otwiera, zapisz go jako JPG lub PNG na telefonie albo komputerze i spróbuj ponownie.

      Czy mogę skopiować paletę jako CSS?

      Tak. Wybierz Skopiuj jako zmienne CSS, aby dostać blok :root z jedną zmienną na kolor, na przykład --color-1: #B2F6E3. Wklej go na górze arkusza stylów i używaj var(--color-1) wszędzie tam, gdzie potrzebujesz tego koloru. Zmienne podążają za wybraną kolejnością, więc --color-1 to najczęściej używany lub najjaśniejszy kolor.

      Więcej darmowych narzędzi

      Za darmo i bez konta. Nic, co wpiszesz, nie jest zapisywane na naszych serwerach.

      Generator czcionek

      Zamień tekst w 24 style, od pogrubionego i kursywy po pismo ozdobne i bąbelki. Skopiuj i wklej gdziekolwiek.

      Otwórz narzędzie →

      Generator bio

      Zdobądź 12 pomysłów na bio dla Instagrama, TikToka, X lub YouTube, z licznikiem znaków na żywo.

      Otwórz narzędzie →

      Generator kodów QR

      Zamień dowolny link w kod QR. Wybierz kolory, pobierz PNG lub SVG. Nigdy nie wygasa.

      Otwórz narzędzie →

      Zobacz wszystkie darmowe narzędzia

      Poradniki: Jak zaprojektować stronę link w bio: układy, motywy, przyciski, Motywy strony link w bio: jak wybrać taki, który konwertuje.

      Powiązane strony
      Źródła
      1. W3C, Understanding SC 1.4.3 Contrast
      2. W3C, Understanding SC 1.4.6 Contrast
      3. W3C, Understanding SC 1.4.11 Non-text Contrast

      Źródła sprawdzone 11 listopada 2026.

      Twoje kolory na Twojej własnej stronie

      Zajmij swoją darmową stronę More.You i ustaw jej tło, przyciski i czcionki w kolorach ze swojego zdjęcia.

      more.you/

      Język