Krāsu gaišo toņu ģenerators
Ģenerējiet gaišākus krāsas toņus, vienmērīgos soļos sajaucot krāsu ar baltu. Ievadiet vienu krāsu jebkurā CSS formātā, izvēlieties no 2 līdz 20 soļiem un sajaukšanas telpu, un iegūstiet tabulu ar HEX, RGB, HSL un OKLCH vērtībām katram gaišajam tonim, sākot ar sākotnējo krāsu. Sajaukšana sRGB telpā atbilst klasiskajiem gaišo toņu rīkiem un Sass, savukārt OKLab nodrošina perceptuāli vienmērīgus soļus. Ideāli piemērots fonu, norāžu rādīšanai, novietojot kursoru, un krāsu skalu veidošanai.
Bieži uzdotie jautājumi
Kas ir gaišais tonis?
Gaišais tonis ir krāsa, kas sajaukta ar baltu. Tā saglabā savu nokrāsu un kļūst gaišāka un bālāka, atšķirībā no tumšā toņa, ko sajauc ar melnu, vai piesātinājuma toņa, ko sajauc ar pelēku.
Kā tiek noteikti soļu intervāli?
Ja ir N soļi, k. rinda sajauc krāsu ar (k - 1) / N baltās krāsas, tāpēc 10 soļi dod 0%, 10%, 20% un tā tālāk līdz 90%. Pirmā rinda vienmēr ir sākotnējā krāsa, un tīri balta krāsa sarakstā nekad netiek iekļauta.
Kāda ir atšķirība starp sRGB un OKLab sajaukšanu?
Sajaucot sRGB telpā, tiek aprēķināta gamma kodēto kanālu vērtību vidējā vērtība, kā to dara Sass mix(), sajaucot ar baltu, un lielākā daļa klasisko gaišo toņu ģeneratoru. Sajaukšana OKLab telpā notiek perceptuālā telpā, tāpēc gaišuma soļi šķiet vienmērīgāki un gaišais gals tik ātri nezaudē krāsainību.
Kādus ievades formātus varu izmantot?
Heksadecimālie kodi ar # vai bez tā, CSS krāsu nosaukumi, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color() un cmyk(). Katrā palaišanas reizē ievadiet vienu krāsu.
Cik gaišo toņu varu ģenerēt?
No 2 līdz 20 vienā palaišanas reizē; pēc noklusējuma 10. Skaitā ir iekļauta sākotnējā krāsa pirmajā rindā.
Kādas vērtības tiek rādītas tabulā?
Katram solim — baltās krāsas daļa, heksadecimālais kods, rgb(), hsl() un oklch() mūsdienu CSS sintaksē. RGB kanālu vērtības ir veseli skaitļi, HSL procentuālās vērtības tiek norādītas ar ne vairāk kā divām zīmēm aiz komata, bet OKLCH gaišums un krāsainība — ar ne vairāk kā četrām.
Kas notiek ar caurspīdīgām krāsām?
Ievades alfa vērtība tiek saglabāta katram gaišajam tonim, jo baltā krāsa tiek piejaukta ar tādu pašu alfa vērtību. Heksadecimālajiem kodiem ir 8 cipari, un CSS funkciju beigās pēc slīpsvītras ir alfa vērtība.
Kas notiek ar krāsām ārpus sRGB?
Sajaukšanā tiek izmantota pilna krāsa, taču HEX, RGB un HSL var attēlot tikai sRGB, tāpēc toņi ārpus gammas šajās kolonnās tiek pārveidoti uz sRGB, izmantojot CSS Color 4 algoritmu. OKLCH kolonnā tiek saglabāta nepārveidotā vērtība.
Kā izmantot gaišos toņus CSS?
Iekopējiet heksadecimālās vai oklch() vērtības pielāgotos rekvizītos, piemēram, --brand-100 un --brand-200. Lai sajauktu krāsas pārlūkprogrammā, izmantojiet color-mix(in oklab, var(--brand) 80%, white), kas dod tādu pašu 20% gaišo toni kā OKLab iestatījums.
Vai uz gaiša toņa var lietot baltu tekstu?
Parasti nē, jo gaišiem toņiem ir mazs kontrasts ar baltu. Izmantojiet tumšu tekstu uz gaišiem toņiem un pārbaudiet katru pāri ar kontrasta pārbaudes rīku; parastam tekstam WCAG AA vajadzīga vismaz 4.5:1 kontrasta attiecība.