Pro Ekstraktor Palety — Paleta w HEX, HSL, OKLCH, CMYK
Wyodrębnij od 3 do 16 dominujących kolorów z dowolnego obrazu w HEX, RGB, HSL, OKLCH i CMYK. Eksportuj do CSS, SCSS, Tailwind, JSON lub palety PNG. W 100% w przeglądarce.
Pro Ekstraktor Palety — Palety Kolorów dla Projektantów i Programistów Front-End
Upuść dowolny obraz i wyodrębnij wysokiej jakości paletę 3 do 16 dominujących kolorów — ze wszystkimi kodami, których potrzebujesz: HEX, RGB, HSL, OKLCH i CMYK. Sortuj według dominacji, jasności lub odcienia, zobacz pasek procentowy obecności każdego koloru na obrazie, opcjonalnie pokaż kolor komplementarny każdej próbki, i eksportuj swoją paletę jako zmienne CSS, zmienne SCSS, fragment konfiguracji Tailwind, JSON, prostą listę hex lub jako obraz PNG do pobrania.
Pięć kodów koloru na próbkę
Kliknij dowolny kod, aby go skopiować. HEX jest najczęstszy w sieci; RGB to surowa wartość 8-bitowa; HSL to odcień / nasycenie / jasność, idealny do tworzenia odcieni i cieni; OKLCH to nowoczesna, percepcyjnie jednolita przestrzeń kolorów wspierana przez CSS Color Level 4 — idealna dla dostępnych i harmonijnych palet; CMYK to przybliżenie dla projektowania druku (model subtraktywny).
Sześć formatów eksportu
Zmienne CSS (:root { --color-1: ... }), zmienne SCSS ($color-1, $color-2…), fragment Tailwind do wklejenia pod extend.colors, JSON ze wszystkimi kodami i procentem dominacji, prosta lista hex, i obraz PNG palety do pobrania w rozmiarze 1200×600 z etykietami HEX i RGB pod każdą próbką — idealne do dzielenia się na Dribbble lub w specyfikacjach projektowych.
Tryby sortowania & harmonie
Dominacja: najbardziej obecne kolory najpierw — paleta fotograficzna. Jasność: od najjaśniejszego do najciemniejszego — przydatne dla rampy wartości UI. Odcień: w kolejności chromatycznej czerwony → pomarańczowy → żółty → zielony → niebieski → fioletowy — przydatne dla próbek tęczowych i inspiracji gradientów. Toggle komplementarny pokazuje mały trójkąt przeciwległego odcienia w rogu każdego chipa — idealny do wykrywania możliwości koloru akcentowego.
Wskazówki
Aby uzyskać najlepsze wyniki, użyj wyraźnego, dobrze oświetlonego zdjęcia z silnymi motywami wizualnymi. Zwiększ liczbę kolorów, gdy obraz jest urozmaicony; zmniejsz ją dla skoncentrowanej palety „gotowej do logo”. Pasek dominacji jest obliczany PO podpróbkowaniu obrazu do około 200×200 (dla szybkości) i grupuje piksele w klastry za pomocą algorytmu Median Cut — tej samej metody używanej w klasycznej kwantyzacji obrazu.
Prywatność
To narzędzie działa w 100% w Twojej przeglądarce. Twój obraz jest odczytywany w pamięci przeglądarki za pomocą API FileReader i nigdy nie jest wysyłany na żaden serwer. Bez AI, bez usługi zewnętrznej, bez biblioteki do pobrania — tylko czysta matematyka JavaScript na pikselach obrazu. Nic nie jest przechowywane; zamknięcie karty wszystko czyści.
Proste i szybkie wyszukiwanie? Wypróbuj Ekstraktor Kolorów z Obrazu.