# Generator svetlejših odtenkov barv

Ustvarite svetlejše odtenke barve tako, da jo v enakomernih korakih mešate z belo. Vnesite eno barvo v poljubnem formatu CSS, izberite od 2 do 20 korakov in prostor za mešanje ter dobite tabelo z vrednostmi HEX, RGB, HSL in OKLCH za vsak svetlejši odtenek, začenši z izvirno barvo. Mešanje v sRGB se ujema s klasičnimi orodji za svetlejše odtenke in Sass, medtem ko OKLab zagotavlja enakomerne zaznavne korake. Idealno za ozadja, stanja ob prehodu kazalca in lestvice.

## Pogosta vprašanja

### Kaj je svetlejši odtenek?

Svetlejši odtenek je barva, pomešana z belo. Ohranita se njen barvni ton, barva pa postane svetlejša in bolj bleda; pri temnejšem odtenku jo pomešamo s črno, pri tonu pa s sivo.

### Kako so razporejeni koraki?

Pri N korakih se v vrstici k barvi primeša (k - 1) / N bele, zato 10 korakov pomeni 0 %, 10 %, 20 % in tako naprej do 90 %. Prva vrstica vedno vsebuje izvirno barvo, čista bela pa ni vključena.

### Kakšna je razlika med mešanjem v sRGB in OKLab?

Pri mešanju v sRGB se izračuna povprečje vrednosti kanalov, kodiranih z gama, kar počnejo Sass mix() pri mešanju z belo in večina klasičnih generatorjev svetlejših odtenkov. Mešanje v OKLab poteka v zaznavnem prostoru, zato so koraki svetlosti videti enakomernejši, svetlejši konec pa ne zbledi tako hitro.

### Katere vhodne formate lahko uporabim?

Kode HEX z znakom # ali brez njega, imena barv CSS, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color() in cmyk(). Pri vsaki izvedbi vnesite eno barvo.

### Koliko svetlejših odtenkov lahko ustvarim?

Od 2 do 20 na izvedbo, privzeto 10. Število vključuje izvirno barvo v prvi vrstici.

### Katere vrednosti prikazuje tabela?

Za vsak korak delež bele barve, kodo HEX, rgb(), hsl() in oklch() v sodobni sintaksi CSS. Kanali RGB so cela števila, odstotki HSL imajo največ dve decimalni mesti, svetlost in nasičenost OKLCH pa največ štiri.

### Kaj se zgodi s prosojnimi barvami?

Prosojnost vhodne barve se ohrani pri vseh svetlejših odtenkih, saj se bela primeša z enako stopnjo prosojnosti. Kode HEX imajo nato 8 števk, funkcije CSS pa se končajo z vrednostjo prosojnosti za poševnico.

### Kaj se zgodi z barvami zunaj sRGB?

Mešanje uporablja celotno barvo, vendar lahko HEX, RGB in HSL prikažejo le sRGB, zato se barve zunaj barvnega obsega v teh stolpcih preslikajo v sRGB z algoritmom CSS Color 4. Stolpec OKLCH ohrani nepreslikano vrednost.

### Kako uporabim svetlejše odtenke v CSS?

Vrednosti HEX ali oklch() kopirajte v lastnosti po meri, kot sta --brand-100 in --brand-200. Če želite mešati kar v brskalniku, color-mix(in oklab, var(--brand) 80%, white) ustvari enak 20-odstotni svetlejši odtenek kot nastavitev OKLab.

### Ali lahko na svetlem odtenku uporabim belo besedilo?

Običajno ne, saj je kontrast svetlih odtenkov z belo majhen. Na svetlih odtenkih uporabite temno besedilo in vsak par preverite z orodjem za preverjanje kontrasta; običajno besedilo za WCAG AA potrebuje najmanj 4.5:1.

Vaš oglas tukaj?

[Pišite nam](mailto:hi@dennn.is?subject=Ogla%C5%A1evanje%20na%20OneClick%20Pro)

[Oglas Zbirka vtičnikov, pripravljena za agente, za WordPress.](https://sleekwp.com/?ref=oneclickpro)