TextArray
100% lokalnie

Konwerter kolorów

Zamieniaj kolory między HEX, RGB i HSL, razem z kanałem alfa i paletą odcieni.

Wejście
4
Wynik
Powiązane narzędzia
Hex na tekst i z powrotemKodowanie i konwersjaGenerator hashówNarzędzia dla programistówGenerator slugówNarzędzia dla programistówGenerator kodów QRNarzędzia dla programistów
Konwerter kolorów
Wklej kolor w dowolnym zapisie, który rozumie CSS — #3b82f6, rgb(59, 130, 246), hsl(217, 91%, 60%) — a dwa pozostałe pojawią się natychmiast. Skrócony hex w rodzaju #f00 zostanie rozwinięty, krzyżyk na początku jest opcjonalny, a narzędzie czyta zarówno starszy zapis z przecinkami, jak i nowszy ze spacjami, bez pytania, którego akurat używasz. Wpisz jeden kolor w wierszu, a przekonwertujesz całą paletę naraz — dokładnie tego potrzebujesz, gdy z projektu graficznego przychodzi kolumna kodów hex, a twoje style są pisane w HSL.
Kanał alfa przechodzi przez konwersję niezależnie od zapisu: rgba(59, 130, 246, 0.5), rgb(59 130 246 / 50%) i ośmioznakowy hex #3b82f680 opisują ten sam półprzezroczysty błękit i każdy zamienia się w pozostałe. Wyłącz „Zachowaj kanał alfa”, jeśli chcesz tylko kolor kryjący. Menu formatu zawęża wynik do samego hex, RGB albo HSL, co przydaje się przy dłuższych listach, a menu składni decyduje między rgb(255, 0, 0) a rgb(255 0 0 / 0.5), więc skopiowany wynik wkleisz wprost do kodu, który już masz. Wielkie litery w hexie to jedno zaznaczenie.
Po włączeniu palety odcieni każdy kolor dostaje tabelę jaśniejszych i ciemniejszych wariantów, mieszanych równomiernie w stronę bieli i czerni. To szybki sposób, by z jednego koloru marki wyprowadzić stany po najechaniu, obramowania czy elementy nieaktywne bez otwierania programu graficznego. Wybierz od jednego do ośmiu kroków na stronę; kolor bazowy stoi pośrodku, przy 0%.
Wszystko działa w twojej przeglądarce — bez wysyłania, bez serwera, bez konta. Niepublikowane kolory marki zostają na twoim komputerze. Wiersze, które nie są kolorem, zostają na miejscu jako komentarz CSS i są liczone w podsumowaniu, więc jedna literówka nigdy nie ukryje reszty długiej listy. Nazwanych kolorów CSS, takich jak rebeccapurple, narzędzie nie zna; te zamień najpierw na hex.
Częste pytania
Jakie zapisy kolorów narzędzie czyta?
Hex o 3, 4, 6 i 8 znakach, z krzyżykiem lub bez; rgb() i rgba(); hsl() i hsla(). Działa zapis z przecinkami i ze spacjami, a odcień przyjmuje jednostki deg, rad, grad i turn. Nazwane kolory, np. rebeccapurple, nie są obsługiwane.
Jak traktowany jest kanał alfa?
Alfa jest odczytywana z czwartego argumentu, z zapisu z ukośnikiem i z ośmioznakowego hexa, a potem wypisywana w wybranym formacie. Po wyłączeniu „Zachowaj kanał alfa” dostaniesz kolor kryjący.
Dlaczego kolor przesuwa się o cyfrę przy powrotnej konwersji?
HSL wypisujemy w pełnych stopniach i pełnych procentach, więc ponowne odczytanie zaokrąglonej wartości może trafić na sąsiedni kolor 8-bitowy: z hsl(217, 91%, 60%) wychodzi #3c83f6, a nie #3b82f6. Przeglądarki zaokrąglają tak samo. Gdy liczy się dokładny bajt, trzymaj się hexa.
Do czego służy paleta odcieni?
Miesza kolor równymi krokami jasności w stronę bieli i czerni oraz wypisuje każdy wariant, dzięki czemu z jednego koloru bazowego zbudujesz odcienie na hover, obramowanie i stan nieaktywny. Wybierz od jednego do ośmiu kroków na stronę.
Czy mój tekst jest gdzieś wysyłany?
Nie. Konwersja działa wyłącznie w twojej przeglądarce, a nic, co wkleisz, nie opuszcza urządzenia.