# Generator rozjaśnień kolorów

Generuj jaśniejsze rozjaśnienia koloru, mieszając go z bielą w równych krokach. Wprowadź jeden kolor w dowolnym formacie CSS, wybierz od 2 do 20 kroków i przestrzeń mieszania, a otrzymasz tabelę z wartościami HEX, RGB, HSL i OKLCH dla każdego rozjaśnienia, począwszy od koloru oryginalnego. Mieszanie w sRGB odpowiada klasycznym narzędziom do generowania rozjaśnień i Sass, a OKLab zapewnia równomierne percepcyjnie kroki. Idealne do teł, stanów najechania i skal.

## Najczęściej zadawane pytania

### Czym jest rozjaśnienie?

Rozjaśnienie to kolor zmieszany z bielą. Zachowuje swój ton, staje się jaśniejszy i bledszy, w przeciwieństwie do odcienia, który uzyskuje się przez zmieszanie z czernią, lub tonu, który powstaje przez zmieszanie z szarością.

### Jak rozmieszczone są kroki?

Przy N krokach wiersz k miesza kolor z bielą w proporcji (k - 1) / N, więc 10 kroków daje 0%, 10%, 20% i tak dalej aż do 90%. Pierwszy wiersz zawsze zawiera oryginalny kolor, a czysta biel nigdy nie trafia na listę.

### Czym różni się mieszanie w sRGB od mieszania w OKLab?

Mieszanie w sRGB uśrednia wartości kanałów zakodowane z użyciem korekcji gamma, tak jak robią to Sass mix() mieszające z bielą i większość klasycznych generatorów rozjaśnień. Mieszanie w OKLab odbywa się w przestrzeni percepcyjnej, dzięki czemu kroki jasności wyglądają na bardziej równomierne, a jasny koniec skali nie traci tak szybko nasycenia.

### Jakich formatów danych wejściowych mogę użyć?

Kody hex z # lub bez, nazwy kolorów CSS, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color() i cmyk(). Wprowadź jeden kolor na każde uruchomienie.

### Ile rozjaśnień mogę wygenerować?

Od 2 do 20 w jednym uruchomieniu, domyślnie 10. Liczba obejmuje oryginalny kolor w pierwszym wierszu.

### Jakie wartości pokazuje tabela?

Dla każdego kroku: udział bieli, kod hex, rgb(), hsl() i oklch() w nowoczesnej składni CSS. Kanały RGB to liczby całkowite, wartości procentowe HSL mają maksymalnie dwa miejsca po przecinku, a jasność i chroma OKLCH maksymalnie cztery.

### Co dzieje się z przezroczystymi kolorami?

Przezroczystość koloru wejściowego jest zachowywana dla każdego rozjaśnienia, ponieważ biel jest mieszana z tym samym poziomem przezroczystości. Kody hex mają wtedy 8 cyfr, a funkcje CSS kończą się przezroczystością po ukośniku.

### Co dzieje się z kolorami spoza sRGB?

Mieszanie wykorzystuje pełny kolor, ale HEX, RGB i HSL obsługują tylko sRGB, więc w tych kolumnach kroki spoza gamy są mapowane do sRGB za pomocą algorytmu Color 4 CSS. Kolumna OKLCH zachowuje wartość bez mapowania.

### Jak używać rozjaśnień w CSS?

Skopiuj wartości hex lub oklch() do własnych właściwości, takich jak --brand-100 i --brand-200. Aby mieszać kolory w przeglądarce, użyj color-mix(in oklab, var(--brand) 80%, white), co daje takie samo rozjaśnienie z 20% bieli jak ustawienie OKLab.

### Czy mogę umieścić biały tekst na jasnym rozjaśnieniu?

Zazwyczaj nie, ponieważ jasne rozjaśnienia mają niski kontrast względem bieli. Używaj ciemnego tekstu na jasnych rozjaśnieniach i sprawdzaj każdą parę za pomocą narzędzia do sprawdzania kontrastu; zwykły tekst wymaga co najmniej 4.5:1, aby spełnić WCAG AA.

Twoja reklama tutaj?

[Napisz do nas](mailto:hi@dennn.is?subject=Reklama%20w%20OneClick%20Pro)

[Reklama Pakiet wtyczek gotowy do pracy z agentami dla WordPress.](https://sleekwp.com/?ref=oneclickpro)