# Generátor zesvětlených barev

Vytvářejte světlejší varianty barvy jejím mícháním s bílou v rovnoměrných krocích. Zadejte jednu barvu v libovolném formátu CSS, zvolte 2 až 20 kroků a prostor míchání. Zobrazí se tabulka s hodnotami HEX, RGB, HSL a OKLCH pro každou světlejší variantu, počínaje původní barvou. Míchání v sRGB odpovídá klasickým nástrojům pro zesvětlení a Sass, zatímco OKLab vytváří perceptuálně rovnoměrné kroky. Ideální pro pozadí, stavy při najetí kurzorem a barevné škály.

## Často kladené otázky

### Co je světlejší varianta?

Světlejší varianta vznikne smícháním barvy s bílou. Zachovává si svůj barevný tón a zesvětluje a bledne, na rozdíl od odstínu, který se míchá s černou, nebo tónu, který se míchá se šedou.

### Jak jsou kroky rozloženy?

Při N krocích se v řádku k smíchá barva s bílou v poměru (k - 1) / N, takže 10 kroků představuje 0 %, 10 %, 20 % a tak dále až do 90 %. První řádek vždy obsahuje původní barvu a čistá bílá v seznamu nikdy není.

### Jaký je rozdíl mezi mícháním v sRGB a OKLab?

Míchání v sRGB vypočítá průměr hodnot kanálů zakódovaných pomocí gama korekce, což dělají Sass mix() s bílou a většina klasických generátorů světlejších variant. Míchání v OKLab probíhá v perceptuálním prostoru, takže kroky světlosti vypadají rovnoměrněji a světlé odstíny se tak rychle nevymývají.

### Jaké vstupní formáty mohu použít?

Hexadecimální kódy s # nebo bez něj, názvy barev CSS, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color() a cmyk(). Při každém spuštění zadejte jednu barvu.

### Kolik světlejších variant mohu vygenerovat?

Od 2 do 20 při jednom spuštění, výchozí počet je 10. Do počtu se započítává původní barva v prvním řádku.

### Jaké hodnoty tabulka zobrazuje?

U každého kroku podíl bílé, hexadecimální kód, rgb(), hsl() a oklch() v moderní syntaxi CSS. Kanály RGB jsou celá čísla, procentuální hodnoty HSL mají až dvě desetinná místa a světlost a sytost OKLCH až čtyři.

### Co se stane s průhlednými barvami?

Alfa kanál vstupní barvy se zachová u každé světlejší varianty, protože se bílá přimíchává se stejnou hodnotou alfa. Hexadecimální kódy pak mají 8 číslic a funkce CSS končí hodnotou alfa za lomítkem.

### Co se stane s barvami mimo sRGB?

Míchání používá celou barvu, ale HEX, RGB a HSL mohou zobrazit pouze sRGB, takže se kroky mimo gamut v těchto sloupcích převedou do sRGB pomocí algoritmu Color 4 CSS. Sloupec OKLCH zachovává nepřevedenou hodnotu.

### Jak použiji světlejší varianty v CSS?

Zkopírujte hexadecimální hodnoty nebo hodnoty oklch() do vlastních vlastností, například --brand-100 a --brand-200. Pokud chcete barvu smíchat přímo v prohlížeči, color-mix(in oklab, var(--brand) 80%, white) vytvoří stejnou světlejší variantu s 20% podílem jako nastavení OKLab.

### Mohu na světlou barvu umístit bílý text?

Obvykle ne, protože světlé barvy mají vůči bílé malý kontrast. Na světlých barvách použijte tmavý text a každý pár zkontrolujte nástrojem pro kontrolu kontrastu; běžný text potřebuje pro WCAG AA kontrast alespoň 4.5:1.

Vaše reklama zde?

[Napište nám](mailto:hi@dennn.is?subject=Inzerce%20na%20OneClick%20Pro)

[Reklama Sada pluginů připravená pro agenty pro WordPress.](https://sleekwp.com/?ref=oneclickpro)